How to use SN Record Picker in Portal to show existing value and to update the same

[DPrasna]

Hi All,

I have some custom fields on core_company table as shown below which are "glide_list" type(like WatchList) it references sys_user table:

I need to show these field on the Portal in a modal or on a page in form just like as shown above.

Also, need to update the fields when any user is being added from Portal

But I don't know if we can use the sn-record picker 

HTML:

<form>
<label for="psso"><b>Product Security </b></label> 

<sn-record-picker id="psso" field="c.getUsr.psso"
table="'sys_user'"
default-query="active=true"
multiple="true"
display-field="'name'"
display-fields="'email'"
value-field="'sys_id'"
search-fields="'name,email'"
page-size="100"
            
>
</sn-record-picker>

</form>

client script

function($scope, spUtil) {


       var c = this; 

       c.getUsr={

			"psso" :''
			
		};	
}

Server:

(function() { 

	data.busContacts=[];
    var compID = $sp.getParameter('comp');  
    var grComp = new GlideRecord('core_company');
	grComp.addQuery('sys_id',compID);
	grComp.query();
	var results = [];
	if(grComp.next())
	{
               
        /*var comp = {};
		comp.prodSec = grComp.getDisplayValue('u_psso_sec');
		comp.privacyRep =grComp.getDisplayValue('u_privacy_rep_gpo_rep');*/
		
		grComp.u_psso_sec = input.psso; 
		
		
			//data.busContacts.push(comp);
               
       }


})();

For example if product security contact field has 2 names it should show in Portal as

And if user selects any other user from the field on the Portal then it should update the backend form with 3rd person name

@Dr Atul G- LNG @Maik Skoddow @Ankur Bawiskar 

[Manoj89]

Hi Prasna,

That's possible

HTML:

<div class="panel panel-primary">
  <div class="panel-heading">Product Security</div>
  <div class="panel-body">
    <sn-record-picker field="users" table="'sys_user'"  multiple="true" display-field="'name'" value-field="'sys_id'" search-fields="'name,sys_id'" page-size="100" placeholder="Watch List"></sn-record-picker>
    <button type="button" class="btn btn-primary" ng-click="c.updateList()"><span ng-if="c.data.st!=''">Update</span><span ng-if="c.data.st==''">Add</span></button>
  </div>
</div>

Client Controller

api.controller = function($scope, spUtil, $rootScope){
	var c = this;

//initiaite record picker field
	$scope.users = {
		displayValue: c.data.record.displayValue,
		value: c.data.record.value,
		name: 'users'
	};

//monitor field change
	$scope.$on("field.change", function(evt, parms) {
		if (parms.field.name == 'users') {
			$scope.data.user = parms.newValue;
			//console.log()
		}
	});

//call server script on clicking update button
	c.updateList = function(){
		c.data.users = $scope.users;
		c.server.update().then(function(r){
			//do something
		}
													);
	};

};

Server Script

(function() {
	var ref = $sp.getParameter('sys_id'), record = $sp.getRecord();
	if (input.keywords != null && input.keywords != ''){
		data.items = getUsers(input.keywords);
	}
	data.record = getList(record);
	//data.tablename = $sp.getParameter('table');

	if (input.users){
		//gs.info("fieldName value is "+input.users.value);
		var inputUsers = input.users.value;
		var shw = false;
		updateIncident(inputUsers);
	}

	function getList(i){
			var inc = {};
			inc.displayValue = i.u_product_security.getDisplayValue();
		  inc.value = i.u_product_security.getValue();
			return inc;
	}

	function updateIncident(ii){
		/*var i = new GlideRecord('incident');
		i.addQuery('sys_id', ref);
		i.query();
		if (i.next()){
			shw = true;
			i.watch_list = ii;
			i.update();
		}*/
		record.u_product_security = ii;
		record.update();
	}
})();