Is there a way to catch the change event of a particular field/component? I saw on the AuraDocs that there is a valueChange event but trying to handle it makes the app throw an error on load. I was wondering if I could build some automatic field validation / search suggestions without relying on other js libraries.


Here is a complete example that does what I think you were attempting to do:

<aura:component implements="force:appHostable">
    <aura:attribute name="expenseName" type="String" default="My Expense"/>
    <aura:handler name="change" value="{!v.expenseName}" action="{!c.expenseNameChanged}"/>     

    <ui:inputText label="Expense Name" value="{!v.expenseName}"/>

in the component's client controller:

    expenseNameChanged : function(component, event, helper) {
        var newValue = event.getParam("value");
        var oldValue = event.getParam("oldValue");
        alert("Expense name changed from '" + oldValue + "' to '" + newValue + "'");

valueChange is definitely what you are looking for - are you wiring it up like this:

<aura:handler name="change" value="{!v.items}" action="{!c.itemsChange}"/>

taken from http://www.salesforce.com/us/developer/docs/lightning/lightning.pdf

What error is the app (and what app are you working in?) throwing?

  • Definitely, the "valueChange" event can't be found and the "change" event never fires. <aura:component> <aura:handler name="change" value="{!v.items}" action="{!c.itemsChange}"/> <ui:inputText aura:id="items" label="Expense Name" value="My Expense" updateOn="change"/> </aura:component> ` itemsChange : function(component, event, helper) { console.log('something is changing'); var v = event.getParam("value"); if (v === component.get("v.items")) { console.log(v.get('v.value')); } }` I'm working on a appHostable cmp inside of SF1. Thanks! – Diego Nov 12 '14 at 18:59
  • Sorry for the mess but couldn't get the linebreaks working. Thanks Doug and quick question: is the AngularJS +Lightning pack you talked about in Dreamforce in github? – Diego Nov 12 '14 at 19:07
  • The code you posted does not really make sense - the ui:inputText is not wired to any component attribute or model property which means there is no 2 way data binding in place. This is similar to missing ng-model in Angular.js - not much is going to happen. Also the component does not appear to even have a v.items attribute defined on it. – Doug Chasman Nov 13 '14 at 12:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.