function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
imrohitimrohit 

can i perfom calculations on the client side in lightning component using jQuery and assign that value to the value attribute of ui:outputText so that i can save this value to my database on click of save button


<aura:iteration items="{!obj.productRenewList}" var="iobj">
                        <tr class="slds_line_height-small g" >                           
                            <td><ui:inputCheckbox value="{!iobj.isSelected}"/></td>
                            <td> <ui:outputText  value="{!iobj.prd.Name}" /> </td>                            
                            <td> <ui:outputText class="a" value="{!iobj.prd.Price__c}" /> </td>
                           
                            <td><lightning:input class="b" type="Number" value="{!iobj.prd.Quantity__c}" /></td>
                            <td><ui:outputText class="c" value="{!iobj.prd.Total_Amount__c }" /> </td>
                        </tr>
                    </aura:iteration>


i want to multiply price and quantity and store that value in totalamount field for each row.
please suggest the solution 

Thanks in advance
Alain CabonAlain Cabon
Hi,

You don't need an extra framework in javascript for this basic recalculation.

Just use onchange
  
<aura:component >
    <aura:attribute name="objs" type="Object[]"/>
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <h1>TEST RECALCULATION</h1>
    <aura:iteration items="{!v.objs}" var="iobj">
        <tr class="slds_line_height-small" >                           
            <td> <ui:outputText value="{!iobj.Name}" /> </td>                            
            <td> <ui:outputText value="{!iobj.Price}" /> </td>   
            <td><lightning:input type="Number" value="{!iobj.Quantity}" onchange="{!c.qtyChanged}" /></td>
            <td><ui:outputText value="{!iobj.Total_Amount}" /> </td>
        </tr>
    </aura:iteration>
</aura:component>
  
({
    doInit : function(cmp, evt, helper) {
        var objs = [{"Name":"Obj1","Price":10,"Quantity":5,"Total_Amount":50},{"Name":"Obj2","Price":12,"Quantity":4,"Total_Amount":48}];
        cmp.set("v.objs",objs);
    },   
    qtyChanged :function(cmp, evt, helper){
        console.log("Change Detected");  
        var objs = cmp.get("v.objs");
        // Recalculation for all the items
        objs.forEach(function(item,index) {
            console.log(item);  
            item.Total_Amount  = item.Price * item.Quantity;
        });
        cmp.set("v.objs",objs);
    }
})