Ttdfjt

usage of mir gefallen

Harley Davidson clattering noise from engine, backfire and failure to start

Is pointing finger in meeting consider bad?

Is it a good security practice to force employees hide their employer to avoid being targeted?

Boss making me feel guilty for leaving the company at the end of my internship

Can an open source licence be revoked if it violates employer's IP?

Does "aurea" have the second meaning?

How can I find out about the game world without meta-influencing it?

Is all-caps blackletter no longer taboo?

Is fission/fusion to iron the most efficient way to convert mass to energy?

Commencez à vous connecter -- I don't understand the phrasing of this

Why are backslashes included in this shell script?

Why can't we feel the Earth's revolution?

A flower's head or heart?

Can an escape pod land on Earth from orbit and not be immediately detected?

Shouldn't it take more energy to break CO2 compared to CO?

Can a 40amp breaker be used safely and without issue with a 40amp device on 6AWG wire?

Am I being scammed by a sugar daddy?

What did the 8086 (and 8088) do upon encountering an illegal instruction?

Can artificial satellite positions affect tides?

Would a bit of grease on overhead door cables or bearings cause the springs to break?

Has JSON.serialize suppressApexObjectNulls ever worked?

Someone who is granted access to information but not expected to read it

Can I get a photo of an Ancient Arrow?

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 Jun 6 at 18:06

Matt SmithMatt Smith

245110

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 Jun 6 at 18:06

Matt SmithMatt Smith

245110

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 Jun 6 at 18:06

Matt SmithMatt Smith

245110

<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 Jun 6 at 18:06

Matt SmithMatt Smith

245110

share|improve this question

asked Jun 6 at 18:06

Matt SmithMatt Smith

245110

asked Jun 6 at 18:06

Matt SmithMatt Smith

245110

asked Jun 6 at 18:06

Matt SmithMatt Smith

245110

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 Jun 6 at 18:21

sfdcfoxsfdcfox

274k14222473

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  i agree with this,but why event.getModifierState() gives error like Uncaught TypeError: Illegal invocation because of locker service?
  
  – sdandamud1
  Jun 6 at 18:37
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sfdcfox - thank you! I appreciate the help.
  
  – Matt Smith
  Jun 6 at 18:42
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @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
  Jun 6 at 18:42
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  so you get value for this `event.getModifierState()' ?
  
  – sdandamud1
  Jun 6 at 18:45
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 yes. At least in my scratch org. Hopefully I don't get Locker issues moving it to dev.
  
  – Matt Smith
  Jun 6 at 19:00
  

  
  
  
  

 | 
show 1 more 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 Jun 6 at 18:21

sfdcfoxsfdcfox

274k14222473

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  i agree with this,but why event.getModifierState() gives error like Uncaught TypeError: Illegal invocation because of locker service?
  
  – sdandamud1
  Jun 6 at 18:37
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sfdcfox - thank you! I appreciate the help.
  
  – Matt Smith
  Jun 6 at 18:42
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @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
  Jun 6 at 18:42
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  so you get value for this `event.getModifierState()' ?
  
  – sdandamud1
  Jun 6 at 18:45
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 yes. At least in my scratch org. Hopefully I don't get Locker issues moving it to dev.
  
  – Matt Smith
  Jun 6 at 19:00
  

  
  
  
  

 | 
show 1 more 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 Jun 6 at 18:21

sfdcfoxsfdcfox

274k14222473

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  i agree with this,but why event.getModifierState() gives error like Uncaught TypeError: Illegal invocation because of locker service?
  
  – sdandamud1
  Jun 6 at 18:37
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sfdcfox - thank you! I appreciate the help.
  
  – Matt Smith
  Jun 6 at 18:42
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @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
  Jun 6 at 18:42
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  so you get value for this `event.getModifierState()' ?
  
  – sdandamud1
  Jun 6 at 18:45
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @sdandamud1 yes. At least in my scratch org. Hopefully I don't get Locker issues moving it to dev.
  
  – Matt Smith
  Jun 6 at 19:00
  

  
  
  
  

 | 
show 1 more 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 Jun 6 at 18:21

sfdcfoxsfdcfox

274k14222473

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 Jun 6 at 18:21

sfdcfoxsfdcfox

274k14222473

answered Jun 6 at 18:21

sfdcfoxsfdcfox

274k14222473

answered Jun 6 at 18:21

sfdcfoxsfdcfox

274k14222473