+ Start a Discussion
Venkat  163Venkat 163 

how to make input field required ( using <lightning:inputfield />) in lightning

I am using <lightning:inputField /> for creating input field in component,I want make input is required or mandatory in lightning component.

Please provide sample code or solution around above senario.
Puspendra SinghPuspendra Singh
Hi Venkat,
add required="true" in your markup for input field.

<aura:component >
    <aura:attribute name="EmpName" type="String" default='' />
    <lightning:input label="Employee Name" value="{!v.EmpName}" required="true"/>
Venkat  163Venkat 163
Thanks for your quick reply Puspendra.

Your Answer work for <lightning:input >,
but I am looking for <lightning:inputField  >,  in <lightning:inputField  > "required" attribute not supporting ,so If you have any customized validation code for <lightning:inputField  > Plesae let me know.

Puspendra SinghPuspendra Singh
I am assuming you are creating some record in salesforce object. And before saving you need to make sure the input value of some fields are not empty. Here is a javascript controller that checks if the Subject field on a case input record is empty of not. 

        var caseRec = component.get("v.caseRec");
        if($A.util.isEmpty(caseRec.Subject) || $A.util.isUndefined(caseRec.Subject)){
            alert('Subject is Required');
priyanshu nemapriyanshu nema

Hi Venket,

You are not able to use validity on lightning:inputField because the attribute is not supported on this component, instead its an attribute for lighting:input.
For validating lightning:inputField , you can refer to 
https://salesforce.stackexchange.com/questions/213804/how-can-one-validate-recordeditform-fields-before-submitting-them-to-the-platf/213905#213905  link provides a perspective as how you can validate values entered on the component.

David Roberts 4David Roberts 4
lightning:inputField DOES accept 'required'
<lightning:inputfield fieldName="Name" required="true"/>

It puts a red asterisk against the field.

You can validate either on the field changing, or on submission of the record.
<lightning:recordEditForm  objectApiName="myObject__c" 
                                      aura:id="recordEditForm" > 

<lightning:inputfield fieldName="Name" required="true"  onchange="{!c.handleChangeName}"/>

handleSubmit: function(component, event, helper) {
        event.preventDefault();       // stop the form from submitting
        //do something to the input
        var fields = event.getParam('fields');
        var recName = fields.Name.toUpperCase();
        fields.Name = recName.replace(/ /g, '_');
        //submit the record