<button />
without type="button"
inside a form triggers submit action when clicked. So all you have to do is add the type="button"
to the button tag.
<button type="button" onclick="{!c.dothisthing}">do this thing</button>
Also have a look at the post here it will help.
I think if you can store the input component using an onfocus
event, you can then capture a keyboard event by either:
either attaching a listener to the window
or wrapping everything in a span or div with a onkeyup
event.
Markup:
<span onkeyup="{!c.handleKeyup}">
<lightning:input label="Name" name="myname" onfocus="{!c.handleFocus}"/>
</span>
Controller:
handleFocus: function(component, event, helper) {
var src = event.getSource();
component.set("v.currentInput",src);
},
handleKeyup: function(component, event, helper) {
//you have the relevant input + the keyboard event
var currentInput = component.get("v.currentInput");
if(event.key == 'Enter') {
console.log(event);
//do something
}
}
EDIT
Forgot to say, to add your focus handler to the dynamically created component, use component.getReference()
to get a ref to the method. Eg in your component creation call, do something like this:
"lightning:input",
{
"aura:id": "findableAuraId",
"onfocus": component.getReference("c.handleFocus"),
"label": "your label",
"name": "your name"
},
In the handleKeyup
method, you can then do whatever processing you need as you have both the keyboard event and the relevant component.
Best Answer
The lightning:input component has an onchange attribute:
component.cmp
controller.js
the documentation for the component can be found here
you can use keycode.info for checking character codes, as to actually identifying the key value in your function, you can refer to Working with Events in Javascript
UPDATE: for some reason, unable to fetch Key event parameters when using lightning input.
Workaround is to wrap the component in an HTML tag that supports onkeypress events:
and a us the event.which property to listen for the pressed key
Tested and works (Winter '18)