Join the #BuildWithBuildAgent Challenge! Get recognized, earn exclusive swag, and inspire the ServiceNow Community with what you can build using Build Agent.  Join the Challenge.

Display when there is no data to display in the widget

fujiwara2
Giga Contributor

Hello

If there is no data to display in the widget, I would like to display a phrase such as "There is currently no data to display".
Is this possible?
If possible, please tell me how to change it.

7 REPLIES 7

Sai Kumar B
Mega Sage

@fujiwara 

In your widget server code while passing data check if it is empty or not using condition and pass the message accordingly.

Sample

if(data.xyz!='') 
c.data.abc = data.xyz; //Passing non empty data to client controller
} else { 
c.data.abc = 'There is currently no data to display'; //Pass error message to client controller
}

Thank you very much.

I tried it, but it doesn't work, probably because the data to be displayed is stored in an array type.

Help me.

▼Server script(Excerpt)

data.notes = [];
var nowtime = new GlideDateTime();
var company = gs.getUser().getCompanyID();
var annGR = new GlideRecord('announcement');
annGR.addQuery('u_announce_type', 'operationalstatus');
annGR.addQuery('active',true);
annGR.addQuery('u_system_name',company).addOrCondition('u_system_name','null');
annGR.addQuery('from', '<', nowtime);
annGR.addQuery('to', '>', nowtime).addOrCondition('to','null');
annGR.orderByDesc('sys_created_on');
annGR.query();
if(data.notes!=''){
while (annGR.next()) {
var annObj = {};
//use service portal helper method to get some display values
$sp.getRecordDisplayValues(annObj, annGR, 'number,title,sys_id');
//get the first 20 characters of the description
annObj.note = annGR.getValue('summary');
//push the populated obj into the array
data.notes.push(annObj);
}
}
else{
data.notes = '現在は正常に運用されています';
}

▼HTML Templete

<div ng-class="['panel', 'panel-{{::c.options.color}}', 'b', 'spw-announcements-root', '{{::c.wid}}', {'accessibility-off': c.accessibilityOff}]">
<div class="panel-heading">
<h3 class="h4 panel-title"><span ng-if="c.options.glyph"><fa name="{{::c.options.glyph}}"/></span>{{::c.options.title}}</h3>
</div>

<div class="list-group">
<a class="list-group-item" ng-repeat="note in data.notes">
<h4 class="list-group-item-heading">
{{note.title}}
</h4>

<p class="list-group-item-text">
{{note.note}}
</p>
</a>
</div>

 

Thank you very much.

I tried it, but it doesn't work, probably because the data to be displayed is stored in an array type.

Help me.

▼Server script(Excerpt)

data.notes = [];
var nowtime = new GlideDateTime();
var company = gs.getUser().getCompanyID();
var annGR = new GlideRecord('announcement');
annGR.addQuery('u_announce_type', 'operationalstatus');
annGR.addQuery('active',true);
annGR.addQuery('u_system_name',company).addOrCondition('u_system_name','null');
annGR.addQuery('from', '<', nowtime);
annGR.addQuery('to', '>', nowtime).addOrCondition('to','null');
annGR.orderByDesc('sys_created_on');
annGR.query();
if(data.notes!=''){
while (annGR.next()) {
var annObj = {};
//use service portal helper method to get some display values
$sp.getRecordDisplayValues(annObj, annGR, 'number,title,sys_id');
//get the first 20 characters of the description
annObj.note = annGR.getValue('summary');
//push the populated obj into the array
data.notes.push(annObj);
}
}
else{
data.notes = '現在は正常に運用されています';
}

▼HTML Templete

<div ng-class="['panel', 'panel-{{::c.options.color}}', 'b', 'spw-announcements-root', '{{::c.wid}}', {'accessibility-off': c.accessibilityOff}]">
<div class="panel-heading">
<h3 class="h4 panel-title"><span ng-if="c.options.glyph"><fa name="{{::c.options.glyph}}"/></span>{{::c.options.title}}</h3>
</div>

<div class="list-group">
<a class="list-group-item" ng-repeat="note in data.notes">
<h4 class="list-group-item-heading">
{{note.title}}
</h4>

<p class="list-group-item-text">
{{note.note}}
</p>
</a>
</div>

@fujiwara 

Try the below server code

data.notes = [];
var nowtime = new GlideDateTime();
var company = gs.getUser().getCompanyID();
var annGR = new GlideRecord('announcement');
annGR.addQuery('u_announce_type', 'operationalstatus');
annGR.addQuery('active',true);
annGR.addQuery('u_system_name',company).addOrCondition('u_system_name','null');
annGR.addQuery('from', '<', nowtime);
annGR.addQuery('to', '>', nowtime).addOrCondition('to','null');
annGR.orderByDesc('sys_created_on');
annGR.query();
while (annGR.next()) {
var annObj = {};
//use service portal helper method to get some display values
$sp.getRecordDisplayValues(annObj, annGR, 'number,title,sys_id');
//get the first 20 characters of the description
annObj.note = annGR.getValue('summary');
//push the populated obj into the array
data.notes.push(annObj);
}
if(data.notes.length === 0){ //If array length is 0, pass error message
data.notes = '現在は正常に運用されています';
}