Create a user search widget in service portal

Deepika28
Tera Contributor

Hi, 

I am trying to create a widget in service portal. It is a search widget which fetches the name of the user from sys_user table as the name is typed and select the user. As I am new to service now, I am not able to figure out the script. Please help me write the html, client and server script.

2 REPLIES 2

Mike Patel
Tera Sage

go to portal and scroll down.

Create new - 

find_real_file.png

Search page template

<div>
  <a href="?id=user_profile&sys_id={{item.sys_id}}" class="h4 text-primary m-b-sm block"> 
    <span ng-bind-html="highlight(item.name, data.q)"></span> - {{item.title}}
  </a>
  <a class="text-muted m-r-sm" style='color:black' href="mailto:{{item.email}}" ng-if="item.email != ''">Email: {{item.email}}</a>
  <span class="text-muted m-r-sm" ng-if="item.phone != ''">Phone: {{item.phone}}</span>
  <span class="text-muted m-r-sm" ng-if="item.department != ''">Department: {{item.department}}</span>
</div>

Data fetch script

(function(query) {
	var results = [];
	/* Calculate your results here. */
	if (!gs.isLoggedIn())
		return results;
	
	var user = new GlideRecord('sys_user');
	user.addEncodedQuery('nameLIKE'+query + '^ORemailLIKE' + query);
	user.query();
	var catCount = 0;
	while (user.next() && catCount < data.limit) {
		if (!$sp.canReadRecord(user))
			continue;
		var item = {};
			item.type = "user";
			item.page = "user_profile";
			$sp.getRecordDisplayValues(item, user, 'name,phone,department,email,title,sys_id');
			item.score = parseInt(user.ir_query_score.getDisplayValue() * 1000);
			item.label = item.name;
			item.primary = item.name;
			results.push(item);
			catCount++;
		}
		return results;
	})(query);

Typeahead script

<g>
<span class='src-name' ng-bind-html="match.label | uibTypeaheadHighlight:query"></span>
<span class='label label-primary' ng-bind-html="match.model.department | uibTypeaheadHighlight:query"></span> 
<span class='badge' ng-bind-html="match.model.phone | uibTypeaheadHighlight:query"></span>
</g>

find_real_file.png

find_real_file.png

Hi Mike, 

I am designing the widget on Service portal which has html, client and server scripts. The widget is a datalist. I donot use typeahead search. Kindly help me with the same.

Thank you.