How to add button to widget

[akshay parekar1]

I want  to add a button named 'New' to my custom widget which will be seen at top right corner

After clicking this button  a new custom widget will open that i have created , how to achieve this?

please tell me solution(syntax) directly if possible as i am so new to service portal

Html template-

<div>
<!-- your widget template -->
  <table border ="1.5 px">
    <tr> <th style="width:120px";> Incident Number </th>
      <th style="width:120px";> Short Description </th>
      <th style="width:120px";> Priority </th>
      <th style="width:120px";> State </th>
    </tr>
    
    <tr ng-repeat ="incident_data in data.incident" > <td>{{incident_data.number}} </td>
      <td>{{incident_data.short_description}} </td>
      <td>{{incident_data.priority}} </td>
      <td>{{incident_data.state}} </td>
    </tr>
  </table>
</div>

[palanikumar · Accepted solution]

Hi,

You cant redirect to a widget. You can either create new page and add your widget. Redirect the button click to that page

Otherwise, you can hide the widget. Make it visible on button click.

Below code can be used for redirection. Add these lines above your existing code and replace new_page with the page where the widget is added

<div style="text-align:right;">
<button onClick="location.href='?id=new_page'">New</button>
</div>

[akshay parekar1]

thanks !!

[AlejandraEs]

How would you make a button that exports data that is not stored in a table within servicenow?
For example:
<h1>Export to Excel</h1>
<button class="btn btn-link" ng-click="exportToExcel('#tableToExport')">
<span class="glyphicon glyphicon-share"></span>
Export to Excel
</button>
<div id="tableToExport">
<table border="1">
<thead>
<tr class="table-header">
<th>Team</th>
<th>Process Type</th>
<th>Cedent</th>
</tr>
</thead>
<tbody>
<tr>
<td>value 1</td>
<td>value 2</td>
<td>value 3</td>
</tr>
<tr>
<td>value 4</td>
<td>value 5</td>
<td>value 6</td>
</tr>
<tr>
<td>10.12.2015</td>
<td>AXA Affin</td>
<td>101024 - Quota Share QS</td>
</tr>
</tbody>
</table>
</div>