Skip to main content

Service Portal: hide/show HTML elements, access them in client controller

1) using ng-hide

HTML:

 <div id="mi-open-tickets" ng-model = "c.openList" ng-hide="{{c.data.showOpen}}">OPEN TICKETS


Client:

function($scope) { /* widget controller */ var c = this; c.data.showOpen = false;//--show c.data.showOpen = true;//--hide




advantage: works great onload

drawback:

doesnt appear possible to hide/show dynamically


2) using display:none/block approach -  no ng-hide

html

<div class="mi-openclosed"> <div class="mi-padded"> <div class="mi-center"> <button class="btn btn-default" ng-click="mi_showOpen()">Open Issues</button>&nbsp; <button class="btn btn-default" ng-click="mi_showClosed()">Closed Issues</button> </div> <div class="typea"> <widget id="typeahead-search" options=data.search_options></widget> </div> </div> </div> <div id="mi-open-tickets" ng-model = "c.openList" >OPEN TICKETS <div ng-repeat="openTicket in ::data.openIssuesList" > <span>{{openTicket.number}} ; {{openTicket.short_description}}</span> </div> </div> <div id="mi-closed-tickets" ng-model = "c.closedList">CLOSED TICKETS <div ng-repeat="closedTicket in ::data.closedIssuesList" > <span>{{closedTicket.number}} ; {{closedTicket.short_description}}</span> </div> </div>












client script:


$scope.mi_showOpen = function() { //c.data.showOpen = false; // c.data.showClosed = true; document.getElementById("mi-closed-tickets").style.display="none"; document.getElementById("mi-open-tickets").style.display="block"; } $scope.mi_showClosed = function() { //c.data.showOpen = true; //c.data.showClosed = false; document.getElementById("mi-closed-tickets").style.display="block"; document.getElementById("mi-open-tickets").style.display="none"; }


Comments

Post a Comment

Popular posts from this blog

ServiceNow check for null or nil or empty (or not)

Haven't tested these all recently within global/local scopes, so feel free to have a play! option 1 use an encoded query embedded in the GlideRecord , e.g.  var grProf = new GlideRecord ( 'x_cls_clear_skye_i_profile' ); grProf . addQuery ( 'status=1^ owner=NULL ' ); grProf . query (); even better use the glideRecord  addNotNullQuery or addNullQuery option 2 JSUtil.nil / notNil (this might be the most powerful. See this link ) example: if ( current . operation () == 'insert' && JSUtil . notNil ( current . parent ) && ! current . work_effort . nil ())  option 3 there might be times when you need to get inside the GlideRecord and perform the check there, for example if the code goes down 2 optional routes depending on null / not null can use gs.nil : var grAppr = new GlideRecord ( 'sysapproval_approver' ); var grUser = new GlideRecord ( 'sys_user' ); if ( grUser . get ( 'sys_id' , current . approver )){...
Post a Comment
Read more

Code a pause/wait - gs.sleep or gs.wait alternative, pause script for specified seconds (timer)

Code a pause/wait - gs.sleep / gs.wait alternative, pause script for specified seconds (timer)  e.g. 10 seconds: do_sleep ( 10000 ); function do_sleep ( milliseconds ) { var start = new Date (). getTime (); for ( var i = 0 ; i < 1e7 ; i ++) { if (( new Date (). getTime () - start ) > milliseconds ){ gs . print ( 'waking up!' ); break ; } } }
Post a Comment
Read more