Turn On – Lightning Part 3 (Multi-Select Picklist)

Turn On – Lightning Part 3 (Multi-Select Picklist)

ui:inputSelect component can be used both for Single Selection and Multiple Selection values by setting the attribute “multipe=true” for the multi-selection, by default it is single list selection.

Here, we will replicate how the standard multi-picklist field looks like in the lightning component.

You can view this in action here:

Step 1: Identify the object and multi-select picklist field which need to be shown in component.

Eg: Hobbies__c on the Contact object

Step 2: Create a Class which will fetch the picklist values for the given field of the object. Don’t forget to mark the method as @AuraEnabled


public class MultiSelectPicklistCls {
@AuraEnabled
public static List<String> getPicklistvalues(sObject objName, String field_apiname){
List<String> optionlist = new List<String>();

Schema.sObjectType sobject_type = objName.getSObjectType();
Schema.DescribeSObjectResult sobject_describe = sobject_type.getDescribe();
Map<String, Schema.SObjectField> field_map = sobject_describe.fields.getMap();

List<Schema.PicklistEntry> pick_list_values = field_map.get(field_apiname).getDescribe().getPickListValues();
for (Schema.PicklistEntry a : pick_list_values) {
optionlist.add(a.getValue());
}
return optionlist;
}
}

Continue reading “Turn On – Lightning Part 3 (Multi-Select Picklist)”

Turn On – Lightning Part 2 (Dynamic Creating Component)

Turn On – Lightning Part 2 (Dynamic Creating Component)

Display the list of components and create a dynamic component based on the button click.

Scenario: Display the list of lightning components as buttons and display the component in action on respective button click.

Step 1: Creating individual lightning components as required and storing the component names in an object.

Step 2:Create a Apex Controller Class “DisplayMyLtngComponentsController” which does the query from the object where we are storing the list of lightning component names

public class DisplayMyLtngComponentsController {
@AuraEnabled
public static List<Lightning_Component__c> getLightningComponents(){
return [Select id, name, Component_Name__c from Lightning_Component__c Order By CreatedDate];
}
}

Step 3: Create a Component called “DisplayComponents” as below:

Continue reading “Turn On – Lightning Part 2 (Dynamic Creating Component)”

Turn On – Lightning Part 1

Turn On – Lightning Part 1

Lightning, Lightning and everywhere Lightning is a next generation UI optimized for speed and it is instantly available from winter 16 onwards.

What is Lightning Component Framework?

  • It’s a UI Framework built on the Open Source Aura Framework for developing dynamic web apps which are readily available for mobile and desktop devices which helps us in building apps completely independent of your data.
  • It supports partitioned multi-tier component development that bridges the client and server.
  • It uses JavaScript on Client Side and Apex on Server Side.

Pre-requisite: Enable ‘My Domain’ in your org by following below navigation:

Continue reading “Turn On – Lightning Part 1”