saveRecord Component: Set Required Picklist values

Question

I am trying to just get a simple record saved, and I continue to get errors saying I am not setting a required field, campus__c.

I have a ui:select component which should explicitly define the values. I then have that saved to both label and value? Then in my component, I try to set the value in the specific field in the lightning Record data with component.set("v.simpleInvention.Campus__c", component.find('campusSelect').get("v.label")); I have tried both v.label and v.value.

Here is my code:

---

<aura:component controller="inventionAura"
            implements="flexipage:availableForRecordHome,force:hasRecordId,lightning:actionOverride" 
            access="global" >

<aura:attribute name="newInvention" type="Object" />
<aura:attribute name="simpleInvention" type="Object" />
<aura:attribute name="accountError" type="String" />    
<force:recordData aura:id="inventionRecordCreator"
                  layoutType="FULL"
                  targetRecord="{!v.newInvention}"
                  targetFields="{!v.simpleInvention}"
                  targetError="{!v.newInventionError}"
                  />


<aura:attribute name="options" type="String[]" description="options" />

<aura:handler name="init" value="{!this}" action="{!c.doInit}" />

<div class="Create Invention">
    <lightning:card iconName="action:new" title="Create Invention">
        <div class="slds-p-horizontal--small">
            <div class="slds-form-element">
                <label class="slds-form-element__label" for="inventionName">Invention Name</label>
                <div class="slds-form-element__control">
                    <input type="text" id="inventionName" class="slds-input" placeholder="New Invention" value="{!v.simpleInvention.Name}"/>
                </div>
            </div>
            <div class="slds-form-element">
                <label class="slds-form-element__label" for="inventionTitle">Invention Title</label>
                <div class="slds-form-element__control">
                    <input type="text" id="inventionTitle" class="slds-input" value="{!v.simpleInvention.Invention_Title__c}"/>
                </div>
            </div>


            <div class="slds-form-element">
                <label class="slds-form-element__label" for="InventionCampus">Invention Location</label>
                <div class="slds-form-element__control">
                    <div class="slds-select_container">
                        <ui:inputSelect aura:id="campusSelect">
                            <ui:inputSelectOption text="Kansas City Med Center" label="Kansas City Med Center" value="Kansas City Med Center"/>
                            <ui:inputSelectOption text="Lawrence" label="Lawrence" value="Lawrence"/>
                        </ui:inputSelect>
                    </div>
                </div>
            </div>

            <br/>
            <lightning:button label="Save Invention" variant="brand" onclick="{!c.handleSaveInvention}"/>                
        </div>
    </lightning:card>

    <!--Display any LDS errors -->
    <aura:if isTrue="{!not(empty(v.newInventionError))}">
        <div class="recordError">
            {!v.recordError}
        </div>
    </aura:if>                      
</div>

---

Controller:

({
doInit : function(component, event, helper) {

    //Prepare new record from template

    component.find("inventionRecordCreator").getNewRecord(
    "Invention__c", // sObject Type (entityAPIName)
        "3D0121D0000000ZbTQAU", //recordTypeID
        false, //skip cache?
        $A.getCallback(function() {
            var rec = component.get("v.newInvention");
            var error = component.get("v.newInventionError");
            if(error || (rec === null)) {
                console.log("Error initializing record template: " + error);
            }else{
                console.log("Record template initialized: " + rec.sobjectType);
            }
        })
    );
}, //don't forget the comma if you have more stuff

handleSaveInvention: function(component, event, helper) {
    if(helper.validateInventionForm(component)) {

        component.set("v.simpleInvention.Name", '');
        //component.set("v.simpleInvention.Title", component.find('inventionTitle').get("v.value"))
        component.set("v.simpleInvention.Campus__c", component.find('campusSelect').get("v.label"));           
        component.find("inventionRecordCreator").saveRecord(function(saveResult) {
            if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") {
                //record is saved successfully
                var resultsToast = $A.get("e.force:showToast");
                resultsToast.setParams({
                    "title": "Saved",
                    "message": "The record was saved."
                });
                resultsToast.fire();
            } else if(saveResult.state === "INCOMPLETE") {
                //handle incomplete state
                console.log("User is offline, device doesn't support drafts.")
            } else if(saveResult.state === "ERROR") {
                //handle the error state
                console.log('Problem saving contact, error: ' + JSON.stringify(saveResult.error));
            } else {
                console.log('Unknown problem, state: ' + saveResult.state + ', error: ' + JSON.stringify(saveResult.error));
            }                
        });
    }
}

})

---

---

As an aside, I also tried to get the values dynamically from the set picklist on the object. I tried this code:

<div class="slds-form-element">
                <label class="slds-form-element__label" for="InventionCampus">Invention Location</label>
                <div class="slds-form-element__control">
                    <ui:inputSelect label="Campus" class="dynamic" aura:id="InventionCampus" value="{!v.simpleInvention.Campus__c}" required="true"/>
                </div>
            </div>

With the controller:

//Pull campus picklist values
    var action = component.get("c.getCampusValues");
    var inputsel = component.find("InventionCampus");
    var campus=[]; 

    //system.debug("Show what vars were received: action=" action + ", inputsel=" + inputsel + ", campus=" + campus);

    action.setCallback(this, function(a) {
        for(var i=0;i< a.getReturnValue().length;i++){
            campus.push({"class": "optionClass", label:a.getReturnValue()[i], value:a.getReturnValue()[i]});
        }
        inputsel.set("v.options", campus);
    });

    $A.enqueueAction(action);
    */   

Answer 1

Just going to state a few pointers from the comments. When using component.find on an a component with multiple elements, it will return an array of those elements. If you are trying to update a pick list, there are two things to consider. If it is single or multi. In either case, you will have to iterate over the array and add the desired value to a string variable to later assign it to the field. If it is multi, the values should be separated by semi-colons, into 1 string. If single, it should only accept 1 string with no semi colon. In order to validate what elements are checked. You can use component.get(‘v.checked’) this will return a Boolean value.