Activity Forums Salesforce® Discussions How can we hide/show a component on click in salesforce lightning?

  • How can we hide/show a component on click in salesforce lightning?

     Uday Kumar updated 3 years ago 3 Members · 4 Posts
  • sushant

    Member
    December 27, 2016 at 2:40 pm

    Hi All,

    How can we hide/show a component on click in lightning?

    please give suggestions

    Thanks

  • Satyakam

    Member
    January 3, 2017 at 8:54 am

    Hi Sushant,

    Component-

    <aura:component controller="HomeApexController">

    <ui:button label="New Account" class="btn btn-block btn-lg btn-info col-sm-5 " press="{!c.NewAccount}" />

    <aura:attribute name="AccAttr" type="Account" default="{'sobjectType':'Account',
    'Name':'',
    'Phone':'',
    'BillingAddress':'',
    'Fax':'',
    'Website':'',
    'Description':''
    }"/>

    <div class="input-group col-sm-5" id="test">
    <ui:inputText aura:id="AccName" class="form-control" placeholder="Write your name" label="Account Name" value="{!v.AccAttr.Name}"/>
    <ui:inputText aura:id="AccPhone" class="form-control" placeholder="Phone Number" label="Phone" value="{!v.AccAttr.Phone}"/>
    <ui:inputText aura:id="AccBaddress" class="form-control" placeholder="Billing Address" label="Address" value="{!v.AccAttr.BillingAddress}"/>
    <ui:inputText aura:id="AccFax" class="form-control" placeholder="Fax" label="Fax" value="{!v.AccAttr.Fax}"/>
    <ui:inputText aura:id="AccWebsite" class="form-control" placeholder="Website" label="Website" value="{!v.AccAttr.Website}"/>
    <ui:inputText aura:id="AccDes" class="form-control" placeholder="Description" label="Description" value="{!v.AccAttr.Description}"/>
    <div class="btn-group">
    <ui:button label="Save" class="btn btn-block btn-success" press="{!c.SaveAccount}"/>
    <ui:button label="Cancel" class="btn btn-block btn-danger" press="{!c.CancelAccount}"/>
    </div>
    </div>

    </aura:component>

    jsController-

    NewAccount : function(component, event, helper){
    document.getElementById('test').style.display = 'block';

    },
    CancelAccount : function(component, event, helper){
    document.getElementById('test').style.display = 'none';
    }

    Hope this may help you.

    Thanks

  • sushant

    Member
    January 3, 2017 at 1:59 pm

    Thanks

  • Uday Kumar

    Member
    November 26, 2018 at 1:16 pm

    Uncaught Action failed: c:ABSplanFileUpload$controller$doInit [Cannot read property 'style' of null]... this is the error I am getting when I used for lightning:fileupload component..

Viewing 1 - 4 of 4 posts

Log In to reply.

Popular Salesforce Blogs

Popular Salesforce Videos