Multiple sn-record-picker

[vidhya_mouli]

I have 2 sn picker in my widget and I want to differentiate between them.

HTML:

<div class="search-container">
    <!-- Record Picker for Priority -->
    <div class="record-picker-container">
        <sn-record-picker 
            field="priority"
            table="'sys_choice'" 
            display-field="'label'"
            value-field="'value'"
            search-fields="'label'"
            page-size="5"
            placeholder="Priority"
            default-query="data.priorityQuery">
          
        </sn-record-picker>
    </div>

    <!-- Record Picker for State -->
    <div class="record-picker-container">
        <sn-record-picker 
            field="state" 
            table="'sys_choice'" 
            display-field="'label'"
            value-field="'value'"
            search-fields="'label'"
            page-size="5"
						placeholder="State"
            default-query="data.stateQuery">
        </sn-record-picker>
    </div>
</div>

Client Script:

$scope.$on("field.change", function(evt, parms) {
		console.log("\nSV: PARMS: " + JSON.stringify(parms.field) + " \n Name: " + parms.field.name);
		
    if (parms.field.name === "priority") {
        c.data.selectedPriority = parms.field.value;
        console.log("Priority Changed: " + c.data.selectedPriority);
    } else if (parms.field.name === "state") {
        c.data.selectedState = parms.field.value;
        console.log("State Changed: " + c.data.selectedState);
    } else {
        console.log("None Changed");
    }
	});

Irrespective of whether I change priority or  state it always displays None Changed. Need help to fix this widget.

parms.field.name is always undefined.

[vidhya_mouli · Accepted solution]

I managed to resolve this. I added the following code to Client Script and that worked.

$scope.priority = { name: 'priority' };
$scope.state = { name: 'state' };