Hi Community, I’m working on a custom UI page in ServiceNow that displays a list of attached documents, each with an “Upload to Current” button. The requirement is that when I click this button on any attachment, it should mark or assign that specific document as the “current document.” Right now, clicking the button just reloads the page and doesn’t perform any action. There are no client scripts or processing scripts currently linked to the button, and I’m new to UI Pages in general. All attachments are loading properly, and I only need help fixing the button’s functionality so that it performs the expected operation of assigning the clicked document as the current one. Any guidance or example implementation would be highly appreciated.
Here is my code:
<div id="tab-20" class="tab-pane active" ng-show="tab2 == 20">
<div class="wrapper wrapper-content animated fadeInRight" >
<table cellpadding="0" cellspacing="0" border="0" id="example" class="jh-table table table-striped crb-rl">
<thead>
<tr>
<td></td>
<th scope="col">
<a ng-attr-title="Previous Document File Name" href="" ng-click="sortBy('file_name')">
<strong>File Name</strong>
<span class="sortorder" ng-show="propertyName === 'file_name'" ng-class="{reverse: reverse}"></span>
<span ng-show="propertyName === 'file_name'&&!reverse" ng-attr-title="{{propertyName === 'file_name'&&!reverse ? 'Ascending Order' : ''}}" class="fa fa-caret-down"></span>
<span ng-show="propertyName === 'file_name'&&reverse" ng-attr-title="{{propertyName === 'file_name'&&reverse ? 'Descending Order' : ''}}" class="fa fa-caret-up"></span>
</a>
</th>
<th scope="col">
<a ng-attr-title="Previous Document Record" href="" ng-click="sortBy('u_record')">
<strong>Record</strong>
<span class="sortorder" ng-show="propertyName === 'u_record'" ng-class="{reverse: reverse}"></span>
<span ng-show="propertyName === 'u_record'&&!reverse" ng-attr-title="{{propertyName === 'u_record'&&!reverse ? 'Ascending Order' : ''}}" class="fa fa-caret-down"></span>
<span ng-show="propertyName === 'u_record'&&reverse" ng-attr-title="{{propertyName === 'u_record'&&reverse ? 'Descending Order' : ''}}" class="fa fa-caret-up"></span>
</a>
</th>
<th scope="col">
<a ng-attr-title="Previous Document Content Type" href="" ng-click="sortBy('content_type')">
<strong>Content Type</strong>
<span class="sortorder" ng-show="propertyName === 'content_type'" ng-class="{reverse: reverse}"></span>
<span ng-show="propertyName === 'content_type'&&!reverse" ng-attr-title="{{propertyName === 'content_type'&&!reverse ? 'Ascending Order' : ''}}" class="fa fa-caret-down"></span>
<span ng-show="propertyName === 'content_type'&&reverse" ng-attr-title="{{propertyName === 'content_type'&&reverse ? 'Descending Order' : ''}}" class="fa fa-caret-up"></span>
</a>
</th>
<th scope="col">
<a ng-attr-title="Previous Document Size Bytes" href="" ng-click="sortBy('size_bytes')">
<strong>Size Bytes</strong>
<span class="sortorder" ng-show="propertyName === 'size_bytes'" ng-class="{reverse: reverse}"></span>
<span ng-show="propertyName === 'size_bytes'&&!reverse" ng-attr-title="{{propertyName === 'size_bytes'&&!reverse ? 'Ascending Order' : ''}}" class="fa fa-caret-down"></span>
<span ng-show="propertyName === 'size_bytes'&&reverse" ng-attr-title="{{propertyName === 'size_bytes'&&reverse ? 'Descending Order' : ''}}" class="fa fa-caret-up"></span>
</a>
</th>
<th scope="col">
<a ng-attr-title="Previous Document Created" href="" ng-click="sortBy('sys_created_on')">
<strong>Created</strong>
<span class="sortorder" ng-show="propertyName === 'sys_created_on'" ng-class="{reverse: reverse}"></span>
<span ng-show="propertyName === 'sys_created_on'&&!reverse" ng-attr-title="{{propertyName === 'sys_created_on'&&!reverse ? 'Ascending Order' : ''}}" class="fa fa-caret-down"></span>
<span ng-show="propertyName === 'sys_created_on'&&reverse" ng-attr-title="{{propertyName === 'sys_created_on'&&reverse ? 'Descending Order' : ''}}" class="fa fa-caret-up"></span>
</a>
</th>
</tr>
</thead>
<tbody>
<tr ng-show="numberOfPrevDocuments>0" ng-repeat="document in previousDocuments | filter:search | orderBy:propertyName:reverse | offset:currentPage*itemsPerPage | limitTo:itemsPerPage ">
<td>
<a ng-attr-title="{{'DownloadPreviousDocument'+document.file_name}}" href="{{ downloadUrl }}/sys_attachment.do?sys_id={{ document.sys_id }}&sysparm_view=&sysparm_record_target=&sysparm_record_row=1&sysparm_record_list=sys_idCONTAINS{{ document.sys_id }}%5EORDERBYsys_created_on&sysparm_record_rows=1" class="btn btn-xs btn-primary btn-xs tabable">Download</a>
<button ng-attr-title="{{'UploadToCurrent'+document.file_name}}" style="display:block;" ng-click="uploadToCurrentDocument(document.sys_id)" class="btn btn-xs btn-primary btn-xs tabable">Upload to Current</button>
</td>
<td> {{ document.file_name }}</td>
<td> {{ document.u_record }} </td>
<td> {{ document.content_type }} </td>
<td> {{ document.size_bytes }} </td>
<td> {{ document.sys_created_on }} </td>
</tr>
<tr ng-show="numberOfPrevDocuments==0||numberOfPrevDocuments==''" >
<td colspan="6" style="text-align:center">
<h4>{{noRecordsMessage}}</h4>
</td>
</tr>
</tbody>
<tfoot>
<td colspan="12">
<div class="pagination">
<ul class="pagination-controle pagination">
<li>
<button ng-attr-title="Previous Document Previous Page" type="button" class="btn btn-primary tabable"
ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1"><
PREV
</button>
</li>
<li>
<span>
Page
{{currentPage+1}}/{{numberOfPages9()==0 ? 1 : numberOfPages9()}}
</span>
</li>
<li>
<button ng-attr-title="Previous Document Next Page" type="button" class="btn btn-primary tabable"
ng-disabled="currentPage >= getPrevDocument().length/itemsPerPage - 1"
ng-click="currentPage=currentPage+1">
NEXT></button>
</li>
</ul>
</div>
</td>
</tfoot>
</table>
</div>
</div>
The Current Document code is also similar, but I'm not able to paste it.
