Lightning Dynamic Drop-down

 Apex Class:

 global class AccountController{
    
    @AuraEnabled
    public static List<Account> getAllAccount() {
        return [select id, name from Account];
    }
}
Account.Component

 <aura:component controller="xyz.AccountController" implements="force:appHostable"> <aura:handler name="init" value="{!this}" action="{!c.doInit}" /> <aura:attribute name="Accounts" type="xyz.Account[]"/> <!--<link rel="stylesheet" type="text/css" href="/resource/SFBootstrap/css/bootstrap.css" />--> <center> <div class="maincontent" align="center" >
/* Single Selection */ <Select class="form-control" style="width:40%;" aura:id="testProj" > <option>Select Account</option> <aura:iteration items="{!v.Accounts}" var="acc"> <option value="{!acc.Id}" >{!acc.Name}</option> </aura:iteration> </Select> <br/>
/* Multi Selections */

 <Select class="form-control" style="width:40%;" aura:id="testProj" multiple="true"> <option>Select Account</option> <aura:iteration items="{!v.Accounts}" var="acc"> <option value="{!acc.Id}" >{!acc.Name}</option> </aura:iteration> </Select> </div> </center> </aura:component>

 AccountController.JS

 ({ doInit : function(component, event, helper) { // for demo, just grab this product by name helper.getAllAccount(component); } })

 AccountHelper.JS

 ({ helperMethod : function() { }, getAllAccount: function(component) { console.log(component); var action = component.get("c.getAllAccount"); console.log(action); var self = this; action.setCallback(this, function(a) { console.log(a); component.set("v.Accounts", a.getReturnValue()); }); $A.enqueueAction(action); } })

OUTPUT

Comments

  1. Piyali7 October 2015 at 10:53

    Great start....:) Nice to learn....keep posted on lightening component...


    Thanks

    ReplyDelete
  2. debashis18 November 2015 at 08:17

    Nce to see u here..keep it up

    ReplyDelete

Post a Comment

Popular posts from this blog

How to use Lightning Toast in Visual force Page

As of now while including the lightning components in vf page some standard functionalities doesn't work. One among them is Toast functionality . There is a workaround to use Toast in VF pages Below are steps, Create new lightning component 1.  Create Lightning Component  VFToast.cmp <aura:component >     <aura:attribute name="toastmsg" type="String" default=""/>     <aura:attribute name="toastType" type="String" default=""/>     <aura:attribute name="toastcss" type="String" default=""/>    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />     <div class="slds-notify_container slds-is-relative" id="toastCmp">         <div  class="{!v.toastcss}" role="alert">             <div class="slds-notify__content">                 <h2 class=...
Read more

Lightning Data Service

Lightning Data Service  to view,edit,create or delete a record in your lightning component without using any Apex code. If you worked on visualforce then you can think about Lightning Data Service as the Lightning Components   version   of the Visualforce standard controller. If you have a Lightning application that creates, reads, updates, or deletes records, Lightning Data Service is the best, most efficient way to do create,read,update and delete operations. Important Attributes:- All you have to do is include force:recordData in your component recordId :  specifies the record id to load. Records can’t be loaded without a recordId that means you component gets to be inserted. layoutType : specifies the layout (FULL or COMPACT) that is used to display the record. Fields : specifies which fields in the record to query. targetRecord : This attribute indicates populated record targetFields : This attribute indicates populated record with simpli...
Read more