Search code examples
javascriptsalesforceapexlwclightning

This page has an error. You might just need to refresh it. Action failed:


'cmp file'

<aura:component >
    
    <aura:attribute name="aval" type="Integer"/>
    <aura:attribute name="bval" type="Integer"/>
    <aura:attribute name="result" type="Integer"/>
    
    
    <lightning:card title="Calculator" iconName ="standard:lead">
        <aura:set attribute="actions">
            <lightning:buttonGroup>
                <lightning:button label="Add" onclcik="{!c.Addme}"/>
                <lightning:button label="Subtract" onclick="{!c.Subme}" />
                <lightning:button label="multiply" onclick="{!c.Mulme}" />

            </lightning:buttonGroup>
        </aura:set> 
        
        
        <lightning:input label="enter the first NO" value="{!v.aval}"/>
        <lightning:input label="enter the second NO" value="{!v.bval}"/>
        <lightning:input label="result" value="{!v.result}"/>
        
   </lightning:card>
</aura:component>

SO basically the above one is my component code 

'Controller code :::::'
'''
({
    Addme : function(component) 
    {
        var A=Component.get("v.aval");
        var B=Component.get("v.bval");
        var C=a+b;
        console.log(c);
        Component.set("v.result",C);
    },
    Subme : function(component) 
    {
        var A=Component.get("v.aval");
        var B=Component.get("v.bval");
        var C=a-b;
        Component.set("v.result",C);
    },
     Mulme : function(component) 
    {
        var A=Component.get("v.aval");
        var B=Component.get("v.bval");
        var C=a*b;
        Component.set("v.result",c);
    }
   
})


here the above one is the controller code where i defined the fucntions for add,sub and mul


'application :'

<aura:application extends="force:slds" >
    <c:v5testing/>
</aura:application>

Here this is my application code where in im calling on the whole it is simple add problem using attributes and input concept in lightning .

PLease help me out I get error in this way --> This page has an error. You might just need to refresh it. Action failed: c:v5testing$controller$Addme [Component is not defined] Failing descriptor: {c:v5testing$controller$Addme}


Solution

  • Few things to be noted in your code that -

    1. spelling of onclick is wrong you can correct it

      <lightning:button label="Add" onclcik="{!c.Addme}"/>

    2. Component and component both are different as javascript is case sensitive language therefore it treats both variables different, so please make a sure correct case, lowercase, or uppercase for variables

    3. Try to use parseInt() javascript method to convert the values into numbers/integers, to be on a safer side.

    Below is your code, which I try to make it error-free

    Cmp File

    <aura:component >
        
        <aura:attribute name="aval" type="Integer"/>
        <aura:attribute name="bval" type="Integer"/>
        <aura:attribute name="result" type="Integer"/>
        
        
        <lightning:card title="Calculator" iconName ="standard:lead">
            <aura:set attribute="actions">
                <lightning:buttonGroup>
                    <lightning:button label="Add" onclick="{!c.Addme}"/>
                    <lightning:button label="Subtract" onclick="{!c.Subme}" />
                    <lightning:button label="multiply" onclick="{!c.Mulme}" />
    
                </lightning:buttonGroup>
            </aura:set> 
            
            
            <lightning:input label="enter the first NO" value="{!v.aval}"/>
            <lightning:input label="enter the second NO" value="{!v.bval}"/>
            <lightning:input label="result" value="{!v.result}"/>
            
       </lightning:card>
    </aura:component>
    

    JS File

    ({
        Addme : function(component) 
        {
            var A=component.get("v.aval");
            var B=component.get("v.bval");
            var C=parseInt(A)+parseInt(B);
            console.log(C);
            component.set("v.result",C);
        },
        Subme : function(component) 
        {
            var A=component.get("v.aval");
            var B=component.get("v.bval");
            var C=parseInt(A)-parseInt(B);
            component.set("v.result",C);
        },
         Mulme : function(component) 
        {
            var A=component.get("v.aval");
            var B=component.get("v.bval");
            var C=parseInt(A)*parseInt(B);
            component.set("v.result",C);
        }
       
    })
    

    App File

    <aura:application extends="force:slds" >
        <c:v5testing/>
    </aura:application>
    

    Please let me know if it help you out also mark it solved, if you like my answer.

    Thanks.