How to clear value of a sn-record-picker when a new value is selected in another sn-record-picker?

[Arsh1]

So i have got two sn-record-pickers and i want to clear the value of one of the sn-record-pickers when a value is changed from another picker

Here is my code:

HTML Code:

<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
Floor Plan
</h2>
</div>
<div class="panel-body">
<div class="col-md-3 col-xs-5 " style="">
<div class="form-inline control-view" ng-if="c.options.show_view == 'true'">
<label class="control-label hidden-xs wrapper-xs " for="view">${Building}</label>
<sn-record-picker field="c.building_picker" table="'x_adsr_ezofficenow_building'" display-field="'name'" display-fields="'number'" value-field="'sys_id'" search-fields="'name'" page-size="10" placeholder="Select a Building" default-query="'managed_bu='+data.user"></sn-record-picker>
</div>
</div>
<div class="col-md-3 col-xs-5 " style="">
<div class="form-inline control-view" ng-if="c.options.show_view == 'true'">
<label class="control-label hidden-xs wrapper-xs " for="view">${Floor}</label>
<sn-record-picker field="c.data.floor" table="'x_adsr_ezofficenow_floor'" display-field="'name'" display-fields="'number'" value-field="'sys_id'" search-fields="'name'" page-size="10" placeholder="Select a Floor" default-query="'building=' + c.data.building" sn-disabled="!data.building"></sn-record-picker>
</div>
</div>
<div class="col-md-3 col-xs-5 " style="">
<div class="form-inline control-view" ng-if="c.options.show_view == 'true'">
<button ng-click= "c.getValue()">Show Floor Plan</button>
</div>
</div>
</div>

Client Script:

function($scope, spModal, spUtil) {

var c = this;

c.getValue = function()
{
c.data.action = "submit";
var location = c.data.floor.value;
if(!c.building_picker.value||!c.data.floor.value)
{
c.data.counter="false";
spUtil.addErrorMessage('Please Select all the fields');
}
else
{
c.data.counter="true";
spModal.open({

title: 'Floor Map',
widget: "location_map",
widgetInput: {
"location": location
},
size: "xl",
buttons: []
}).then(function() {
jslog('widget dismissed');
})
}
c.server.update().then(function(response){})
}

c.building_picker = {
displayValue: c.data.building_dv,
value: c.data.building,
name: 'building'
};

$scope.$on("field.change", function(evt, parms) {

if (parms.field.name == 'building') {

c.data.building_dv = parms.displayValue;
c.data.building = parms.newValue;
}
});
}

[Pranesh072 · Accepted solution]

you can try 

$scope.[field name].displayValue = "";

$scope.[field name].value = "";

[Arsh1]

Can you tell me where or how i have to write this code?

Inside this function:

$scope.$on("field.change", function(evt, parms) {

if (parms.field.name == 'building') {

c.data.building_dv = parms.displayValue;
c.data.building = parms.newValue;
}
});

[Pranesh072]

which value you want to clear on selection of which value?

[Arsh1]

It worked Thank you so much 🙂