3

My reading of the lightning:inputField and related lightning:recordEditForm docs is that the record is read and written based on the Id supplied via the recordId attribute. There is no option to bind to a record that has already been loaded as lightning:input does via its value attribute. This makes lightning:inputField unusable in pure client-side logic where changes in one place are reflected in other places on the screen without round trips to the server.

So it appears that there is still no way to create input fields (or output fields) that are bound to the SObject metadata so saving a lot of tedious programming work (as lightning:inputField is) yet manipulate existing client-side data (as lightning:input does).

Or am I missing something here?

(For me leaving out the recordId as described in the help like this:

To create a record create layout, use this component with lightning:recordEditForm and pass in the object API name of the record you're creating.

results in no fields being displayed.)

2 Answers 2

2

Looks like the value attribute is added now as a part of lightning:inputfield. To create a record here is a below code thats working for me

<aura:component implements="force:hasRecordId,flexipage:availableForRecordHome">

<aura:attribute name="companyName" type="String"/>
   <lightning:layout verticalAlign="start" multipleRows="true">
    <lightning:layoutItem flexibility="auto" padding="around-small">
        <lightning:input type="text" label="Campaign" value="{!v.companyName}" aura:id="cmpName" onchange="{!c.handleOnchange}"/>
        <lightning:recordEditForm aura:id="recordEditForm" 
                            objectApiName="Lead" onsuccess="{!c.handleSuccess}" onsubmit="{!c.handleSubmit}" onload="{!c.handleOnload}">
            <lightning:messages />
            <lightning:inputField fieldName="Name" />
            <lightning:inputField fieldName="Company" value="{!v.companyName}" aura:id="company"/>
            <lightning:inputField fieldName="Phone" />
            <lightning:button  variant="brand" class="btn" type="submit" label="Create new lead" />
        </lightning:recordEditForm>
    </lightning:layoutItem>
   </lightning:layout>
</aura:component>

The Controller code for same

({
    handleSuccess : function(component, event, helper) {
      console.log(event.getParams().response);
      for (let key of Object.keys(event.getParams().response)) {
        console.log(key + event.getParams().response[key]);
      }
     console.log(event.getParams().response.id);
},

handleOnchange : function(component, event, helper) {
    component.find("company").set("v.fieldName","Company");
    var company = component.get("v.companyName")
    component.find("company").set("v.value",company);
},

  handleOnload : function(component, event, helper) {
    console.log('Load Event' + JSON.stringify(event.getParams()));
  },
})
2
  • 1
    Thanks Mohith, you are right that the lightning:inputField do render when there is no recordId and have an onchange attribute. Presently having trouble with the value attribute when the value is loaded after the lightning:inputField has been created: the value does not update. That's the problem Ravi is seeing too; having to programmatically set the value is a bit painful for me.
    – Keith C
    Commented Feb 8, 2018 at 13:32
  • Agree its not two way binded and looks like it is manual at this point . Commented Feb 8, 2018 at 15:34
1

Spring 18 : Value Attribute in lightning:inputField

Not sure if you are running into same issue. but i have a solution. please do check

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .