Simple calculator program in lightning



<aura:component>
 <aura:attribute name="no1" type="Integer"/>
 <aura:attribute name="no2" type="Integer"/>
 <aura:attribute name="Total" type="Integer"/>
  <div align="center">
 <ui:inputnumber label="Number1" value="{!v.no1}" placeholder="Enter the number1"/>
 <ui:inputnumber label="Number2"  value="{!v.no2}" placeholder="Ente the number2"/>
    <br></br>
 <div class="backgroundInverse">
     <lightning:buttonGroup>
           <lightning:button  label="add"   onclick="{!c.addOperation}"/>
           <lightning:button  label="sub"   onclick="{!c.subOperation}"/>
           <lightning:button  label="mul"   onclick="{!c.mulOperation}"/>
           <lightning:button  label="div"   onclick="{!c.divOperation}"/>
    </lightning:buttonGroup>
    <br/> The total value is {!v.Total}
    </div>
    </div>
  </aura:component>
 
 
  ({
    addOperation:function(component,event,helper){
        var firstvalue=component.get("v.no1");
        var secondvalue=component.get("v.no2");
        var result=firstvalue+secondvalue;
        component.set("v.Total",result);
    },
     subOperation:function(component,event,helper){
        var firstvalue=component.get("v.no1");
        var secondvalue=component.get("v.no2");
        var result=firstvalue-secondvalue;
        component.set("v.Total",result);
    },
    mulOperation:function(component,event,helper){
        var firstvalue=component.get("v.no1");
        var secondvalue=component.get("v.no2");
        var result=firstvalue*secondvalue;
        component.set("v.Total",result);
    },
     divOperation:function(component,event,helper){
        var firstvalue=component.get("v.no1");
        var secondvalue=component.get("v.no2");
        var result=firstvalue/secondvalue;
        component.set("v.Total",result);
    },
   
   
})

Comments