[SalesForce] Binding lightning:inputField to a client-side SObject instance not an SObject Id

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.)

Best Answer

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()));
  },
})
Related Topic