You need to sign in to do that
Don't have an account?
suji srinivasan
How to display field by picklist values?
I need to display calender field for industry picklist field value 1.
<aura:component controller="DynamicPicklist" implements="flexipage:availableForAllPageTypes,force:appHostable">
<!--<aura:attribute name='flag' type="boolen" default="false"/>-->
<aura:attribute name="fieldMap" type="Map"/>
<aura:attribute name="lead" type="Lead" default="{'sobjectType':'Lead',
'LastName': '',
'Company': '',
'Email': '',
'Phone': '',
'Industry': ''}"/>
<div class="slds-m-around--xx-large">
<div class="container-fluid">
<div class="form-group">
<lightning:input name="Name" type="text" label="Lead Name" value="{!v.lead.LastName}" />
</div>
<div class="form-group">
<lightning:input name="Company" type="text" label="Company" value="{!v.lead.Company}" />
</div>
<div class="form-group">
<lightning:input name="Email" type="email" label="Email" value="{!v.lead.Email}" />
</div>
<div class="form-group">
<lightning:input name="Phone" type="phone" label="Phone" value="{!v.lead.Phone}" />
</div>
<div class="form-group">
<lightning:select aura:id="industryPicklist" value="{!v.lead.Industry}" onchange="{!c.handleOnChange}" name="Industry" label="Industry" required="true">
<option value="">--None--</option>
<option value="1">Re engagement</option>
<option value="2">Inadequate Data</option>
</lightning:select>
</div>
<aura:if isTrue="{!v.lead.Industry=='Reengagement'}">
<lightning:input type="date" name="input1" label="Enter a date" value="{! v.date }" />
</aura:if>
</div>
<br/>
<lightning:button variant="brand" label="Submit" onclick="{!c.LeadSave}" />
</div>
</aura:component>
controller:
({
doInit: function(component, event, helper) {
helper.getPicklistValues(component, event);
},
LeadSave : function(component, event, helper) {
helper.saveLead(component, event);
},
//handle Industry Picklist Selection
handleOnChange : function(component, event, helper) {
if(event.target.value == 'Reengagement'){
component.set("v.flag", "true")
}else{
component.set("v.flag", "false")
}
}
})
Helper:
({
getPicklistValues: function(component, event) {
var action = component.get("c.getIndustryFieldValue");
action.setCallback(this, function(response) {
var state = response.getState();
if (state === "SUCCESS") {
var result = response.getReturnValue();
var fieldMap = [];
for(var key in result){
fieldMap.push({key: key, value: result[key]});
}
component.set("v.fieldMap", fieldMap);
}
});
$A.enqueueAction(action);
},
saveLead : function(component, event) {
var lead = component.get("v.lead");
var action = component.get("c.createLead");
action.setParams({
leadobj : lead
});
action.setCallback(this,function(response){
var state = response.getState();
if(state === "SUCCESS"){
alert('Record Created Successfully!!');
} else if(state === "ERROR"){
var errors = action.getError();
if (errors) {
if (errors[0] && errors[0].message) {
alert(errors[0].message);
}
}
}
});
$A.enqueueAction(action);
}
})
Apex:
public class DynamicPicklist {
@AuraEnabled
Public static void createLead(Lead leadobj){
try{
insert leadobj;
}catch(Exception e){
System.debug(e.getMessage());
System.debug(e.getLineNumber());
}
}
@AuraEnabled
public static Map<String, String> getIndustryFieldValue(){
Map<String, String> options = new Map<String, String>();
Schema.DescribeFieldResult fieldResult = Lead.Industry.getDescribe();
List<Schema.PicklistEntry> pValues = fieldResult.getPicklistValues();
for (Schema.PicklistEntry p: pValues) {
options.put(p.getValue(), p.getLabel());
}
return options;
}
}
<aura:component controller="DynamicPicklist" implements="flexipage:availableForAllPageTypes,force:appHostable">
<!--<aura:attribute name='flag' type="boolen" default="false"/>-->
<aura:attribute name="fieldMap" type="Map"/>
<aura:attribute name="lead" type="Lead" default="{'sobjectType':'Lead',
'LastName': '',
'Company': '',
'Email': '',
'Phone': '',
'Industry': ''}"/>
<div class="slds-m-around--xx-large">
<div class="container-fluid">
<div class="form-group">
<lightning:input name="Name" type="text" label="Lead Name" value="{!v.lead.LastName}" />
</div>
<div class="form-group">
<lightning:input name="Company" type="text" label="Company" value="{!v.lead.Company}" />
</div>
<div class="form-group">
<lightning:input name="Email" type="email" label="Email" value="{!v.lead.Email}" />
</div>
<div class="form-group">
<lightning:input name="Phone" type="phone" label="Phone" value="{!v.lead.Phone}" />
</div>
<div class="form-group">
<lightning:select aura:id="industryPicklist" value="{!v.lead.Industry}" onchange="{!c.handleOnChange}" name="Industry" label="Industry" required="true">
<option value="">--None--</option>
<option value="1">Re engagement</option>
<option value="2">Inadequate Data</option>
</lightning:select>
</div>
<aura:if isTrue="{!v.lead.Industry=='Reengagement'}">
<lightning:input type="date" name="input1" label="Enter a date" value="{! v.date }" />
</aura:if>
</div>
<br/>
<lightning:button variant="brand" label="Submit" onclick="{!c.LeadSave}" />
</div>
</aura:component>
controller:
({
doInit: function(component, event, helper) {
helper.getPicklistValues(component, event);
},
LeadSave : function(component, event, helper) {
helper.saveLead(component, event);
},
//handle Industry Picklist Selection
handleOnChange : function(component, event, helper) {
if(event.target.value == 'Reengagement'){
component.set("v.flag", "true")
}else{
component.set("v.flag", "false")
}
}
})
Helper:
({
getPicklistValues: function(component, event) {
var action = component.get("c.getIndustryFieldValue");
action.setCallback(this, function(response) {
var state = response.getState();
if (state === "SUCCESS") {
var result = response.getReturnValue();
var fieldMap = [];
for(var key in result){
fieldMap.push({key: key, value: result[key]});
}
component.set("v.fieldMap", fieldMap);
}
});
$A.enqueueAction(action);
},
saveLead : function(component, event) {
var lead = component.get("v.lead");
var action = component.get("c.createLead");
action.setParams({
leadobj : lead
});
action.setCallback(this,function(response){
var state = response.getState();
if(state === "SUCCESS"){
alert('Record Created Successfully!!');
} else if(state === "ERROR"){
var errors = action.getError();
if (errors) {
if (errors[0] && errors[0].message) {
alert(errors[0].message);
}
}
}
});
$A.enqueueAction(action);
}
})
Apex:
public class DynamicPicklist {
@AuraEnabled
Public static void createLead(Lead leadobj){
try{
insert leadobj;
}catch(Exception e){
System.debug(e.getMessage());
System.debug(e.getLineNumber());
}
}
@AuraEnabled
public static Map<String, String> getIndustryFieldValue(){
Map<String, String> options = new Map<String, String>();
Schema.DescribeFieldResult fieldResult = Lead.Industry.getDescribe();
List<Schema.PicklistEntry> pValues = fieldResult.getPicklistValues();
for (Schema.PicklistEntry p: pValues) {
options.put(p.getValue(), p.getLabel());
}
return options;
}
}
https://developer.salesforce.com/forums/?id=9062I000000Qv1oQAC
Thank you for your support.
All Answers
Hey Suji,
Kindly check this document to make the field enable based on picklist value:-
https://naveendhanaraj.wordpress.com/2017/11/08/display-the-field-based-on-chosen-picklist-value-in-dropdown-by-using-in-lightning-component/
If this help, kindly mark it as the best answer.
Regards,
Priya Ranjan
component
<aura:component controller="DynamicPicklist" implements="flexipage:availableForAllPageTypes,force:appHostable">
<aura:attribute name="flag" type="boolean" default="false" />
<aura:attribute name="fieldMap" type="Map"/>
<aura:attribute name="lead" type="Lead" default="{'sobjectType':'Lead',
'LastName': '',
'Company': '',
'Email': '',
'Phone': '',
'Industry': ''}"/>
<div class="slds-m-around--xx-large">
<div class="container-fluid">
<div class="form-group">
<lightning:input name="Name" type="text" label="Lead Name" value="{!v.lead.LastName}" />
</div>
<div class="form-group">
<lightning:input name="Company" type="text" label="Company" value="{!v.lead.Company}" />
</div>
<div class="form-group">
<lightning:input name="Email" type="email" label="Email" value="{!v.lead.Email}" />
</div>
<div class="form-group">
<lightning:input name="Phone" type="phone" label="Phone" value="{!v.lead.Phone}" />
</div>
<div class="form-group">
<lightning:select aura:id="industryPicklist" value="{!v.lead.Industry}" onchange="{!c.handleOnChange}" name="Industry" label="Industry" required="true">
<option value="">--None--</option>
<option value="1">Re engagement</option>
<option value="2">Inadequate Data</option>
</lightning:select>
</div>
<aura:if isTrue="{!v.flag}">
<lightning:input type="date" name="input1" label="Enter a date" value="{! v.date }" />
</aura:if>
</div>
<br/>
<lightning:button variant="brand" label="Submit" onclick="{!c.LeadSave}" />
</div>
</aura:component>
controller:
({
doInit: function(component, event, helper) {
helper.getPicklistValues(component, event);
},
LeadSave : function(component, event, helper) {
helper.saveLead(component, event);
},
//handle Industry Picklist Selection
handleOnChange : function(component, event, helper) {
var sel = component.find("industryPicklist").get("v.value");
if (sel=="Re engagement") {
component.set("v.flag",true);
}
else if(sel=="Inadequate Data"){
component.set("v.flag",false);
}
}
})
https://developer.salesforce.com/forums/?id=9062I000000Qv1oQAC
Thank you for your support.