Mfcttrf

How can I get an unreasonable manager to approve time off?

Why was this person allowed to become Grand Maester?

Ability To Change Root User Password (Vulnerability?)

Teaching a class likely meant to inflate the GPA of student athletes

How to safely destroy (a large quantity of) valid checks?

How come the nude protesters were not arrested?

What aircraft was used as Air Force One for the flight between Southampton and Shannon?

I have a problematic assistant manager, but I can't fire him

sed + add word before string only if not exists

Overlapping String-Blocks

Bb13b9 confusion

Moving points closer to polyline using ModelBuilder?

Check if three arrays contains the same element

With Ubuntu 18.04, how can I have a hot corner that locks the computer?

How to hide rifle during medieval town entrance inspection?

How to handle (one's own) self-harm scars (on the arm), in a work environment?

Is it possible to fly backward if you have a 'really strong' headwind?

60s or 70s novel about Empire of Man making 1st contact with 1st discovered alien race

Non-aqueous eyes?

Extreme flexible working hours: how to get to know people and activities?

Is it legal for a bar bouncer to confiscate a fake ID

Why does Sin[b-a] simplify to -Sin[a-b]?

Is it safe to change the harddrive power feature so that it never turns off?

A map of non-pathological topology?

Firing EventListener inside Controller method

Dynamically binding to a controller method in LightningCalling a component method from another component: Lightning aura:event not firingCall another method from a method in same Lightning controllerhow to call controller method from lightning actionaura:valueChange not firing on attributeLightning - JS controller invoking its own method - failureLightning Component JS controller call one method from other method without helperDynamic Aura:Id inside Aura:IterationVariable add on a Javascript controller inside -> component.find(' variable ') markuptoLowerCase method not working inside a filter method

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;

2

I'm trying to implement something that I would do in plain JavaScript and get it to work in Lightning. I want to detect a keyup action on an input field, so I have my component wrapped within a span like this:

<span onkeyup="!c.keyCheck">
 <lightning:input aura:id="pwInput" type="password" label="Password" />
</span>

And my Controller method:

keyCheck : function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 

This isn't firing. If this were vanilla JavaScript I'd have the EventListener set in the JS like this (which works fine in plain JS):

var input = document.getElementById("pwInput");

input.addEventListener("keyup", function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 
);

But I thought that's what adding onkeyup="!c.keyCheck" in the component was doing. Do you have any suggestions?

lightning-aura-components lightning javascript

share|improve this question

asked 8 hours ago

Matt SmithMatt Smith

235110

add a comment | 

2

I'm trying to implement something that I would do in plain JavaScript and get it to work in Lightning. I want to detect a keyup action on an input field, so I have my component wrapped within a span like this:

<span onkeyup="!c.keyCheck">
 <lightning:input aura:id="pwInput" type="password" label="Password" />
</span>

And my Controller method:

keyCheck : function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 

This isn't firing. If this were vanilla JavaScript I'd have the EventListener set in the JS like this (which works fine in plain JS):

var input = document.getElementById("pwInput");

input.addEventListener("keyup", function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 
);

But I thought that's what adding onkeyup="!c.keyCheck" in the component was doing. Do you have any suggestions?

lightning-aura-components lightning javascript

share|improve this question

asked 8 hours ago

Matt SmithMatt Smith

235110

add a comment | 

I'm trying to implement something that I would do in plain JavaScript and get it to work in Lightning. I want to detect a keyup action on an input field, so I have my component wrapped within a span like this:

<span onkeyup="!c.keyCheck">
 <lightning:input aura:id="pwInput" type="password" label="Password" />
</span>

And my Controller method:

keyCheck : function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 

This isn't firing. If this were vanilla JavaScript I'd have the EventListener set in the JS like this (which works fine in plain JS):

var input = document.getElementById("pwInput");

input.addEventListener("keyup", function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 
);

But I thought that's what adding onkeyup="!c.keyCheck" in the component was doing. Do you have any suggestions?

lightning-aura-components lightning javascript

share|improve this question

asked 8 hours ago

Matt SmithMatt Smith

235110

<span onkeyup="!c.keyCheck">
 <lightning:input aura:id="pwInput" type="password" label="Password" />
</span>

keyCheck : function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 

var input = document.getElementById("pwInput");

input.addEventListener("keyup", function(event) 
 // If "caps lock" is pressed, display the warning text
 if (event.getModifierState("CapsLock")) 
 console.log("Caps lock on");
 else 
 console.log("Caps lock off");
 
);

share|improve this question

asked 8 hours ago

Matt SmithMatt Smith

235110

share|improve this question

asked 8 hours ago

Matt SmithMatt Smith

235110

asked 8 hours ago

Matt SmithMatt Smith

235110

asked 8 hours ago

Matt SmithMatt Smith

235110

1 Answer
1

active

oldest

votes

3

Controller methods always have three parameters: component, event, helper, in that order. What's confused you is that you've named the first parameter "event". This is actually the component itself. This difference is the main change between vanilla JavaScript and Aura components.

You need to use the second parameter:

keyCheck: function(component, event) 
 if(event.key === 'CapsLock') 
 console.log('Caps Lock pressed');
 else 
 console.log('Caps Lock was not pressed');
 

share|improve this answer

answered 8 hours ago

sfdcfoxsfdcfox

273k14221472

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  i agree with this,but why event.getModifierState() gives error like Uncaught TypeError: Illegal invocation because of locker service?
  
  – sdandamud1
  8 hours ago
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sfdcfox - thank you! I appreciate the help.
  
  – Matt Smith
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 - I don't know why that happens. I'm using event.getModifierState in this instance because event.keyCode is deprecated and not recommended now.
  
  – Matt Smith
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  so you get value for this `event.getModifierState()' ?
  
  – sdandamud1
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 yes. At least in my scratch org. Hopefully I don't get Locker issues moving it to dev.
  
  – Matt Smith
  7 hours ago
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "459"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fsalesforce.stackexchange.com%2fquestions%2f265061%2ffiring-eventlistener-inside-controller-method%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

3

Controller methods always have three parameters: component, event, helper, in that order. What's confused you is that you've named the first parameter "event". This is actually the component itself. This difference is the main change between vanilla JavaScript and Aura components.

You need to use the second parameter:

keyCheck: function(component, event) 
 if(event.key === 'CapsLock') 
 console.log('Caps Lock pressed');
 else 
 console.log('Caps Lock was not pressed');
 

share|improve this answer

answered 8 hours ago

sfdcfoxsfdcfox

273k14221472

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  i agree with this,but why event.getModifierState() gives error like Uncaught TypeError: Illegal invocation because of locker service?
  
  – sdandamud1
  8 hours ago
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sfdcfox - thank you! I appreciate the help.
  
  – Matt Smith
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 - I don't know why that happens. I'm using event.getModifierState in this instance because event.keyCode is deprecated and not recommended now.
  
  – Matt Smith
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  so you get value for this `event.getModifierState()' ?
  
  – sdandamud1
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 yes. At least in my scratch org. Hopefully I don't get Locker issues moving it to dev.
  
  – Matt Smith
  7 hours ago
  

  
  
  
  

add a comment | 

3

Controller methods always have three parameters: component, event, helper, in that order. What's confused you is that you've named the first parameter "event". This is actually the component itself. This difference is the main change between vanilla JavaScript and Aura components.

You need to use the second parameter:

keyCheck: function(component, event) 
 if(event.key === 'CapsLock') 
 console.log('Caps Lock pressed');
 else 
 console.log('Caps Lock was not pressed');
 

share|improve this answer

answered 8 hours ago

sfdcfoxsfdcfox

273k14221472

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  i agree with this,but why event.getModifierState() gives error like Uncaught TypeError: Illegal invocation because of locker service?
  
  – sdandamud1
  8 hours ago
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sfdcfox - thank you! I appreciate the help.
  
  – Matt Smith
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 - I don't know why that happens. I'm using event.getModifierState in this instance because event.keyCode is deprecated and not recommended now.
  
  – Matt Smith
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  so you get value for this `event.getModifierState()' ?
  
  – sdandamud1
  8 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 yes. At least in my scratch org. Hopefully I don't get Locker issues moving it to dev.
  
  – Matt Smith
  7 hours ago
  

  
  
  
  

add a comment | 

Controller methods always have three parameters: component, event, helper, in that order. What's confused you is that you've named the first parameter "event". This is actually the component itself. This difference is the main change between vanilla JavaScript and Aura components.

You need to use the second parameter:

keyCheck: function(component, event) 
 if(event.key === 'CapsLock') 
 console.log('Caps Lock pressed');
 else 
 console.log('Caps Lock was not pressed');
 

share|improve this answer

answered 8 hours ago

sfdcfoxsfdcfox

273k14221472

keyCheck: function(component, event) 
 if(event.key === 'CapsLock') 
 console.log('Caps Lock pressed');
 else 
 console.log('Caps Lock was not pressed');
 

share|improve this answer

answered 8 hours ago

sfdcfoxsfdcfox

273k14221472

answered 8 hours ago

sfdcfoxsfdcfox

273k14221472

answered 8 hours ago

sfdcfoxsfdcfox

273k14221472