How to refresh a UI page after deleting a record?

jenny32 · ‎10-07-2015

Hi All,

I have a UI page, in which I have written code to display he list of records from a table. I created a "delete" button next to every record.

The code is shown below:

HTML:

<button style="width:95%; color:#1E90FF;" type="Submit" onClick="deleteFunction('$[inc.sys_id]');"><b>Delete</b></button>

CLient Script:

function deleteFunction(id){

var gr= new GlideRecord('<table name>);

gr.addQuery('sys_id','=',id);

gr.query();

while(gr.next()){

gr.deleteRecord();

}

//window.location.reload(); //page is reloaded but the data is not deleted

//window.reload(); not working

//contentWindow.location.reload();

//location.reload(); //loading but data not deleted

self.location['reload']();

}

I tried with these three lines of code:

1)window.location.reload();

2) location.reload();

3) self.location['reload']();

In above cases, when I click delete button, the page is reloading but the record is not deleted from the page.

Can anyone tell me what has to be done?

Any help will be highly appreciated.

Thanks,

Jenny

ChrisBurks · ‎10-14-2015

If there weren't any stipulations on using the Process Script portion of the UI Page, one solution that should work is to

Wrap the table within <g:ui_form> tags
Change the button markup to something similar to this
- <button type="submit" onclick="getRecord('$[inc.sys_id]')">Delete</button><br/>
After the table place a hidden input element giving it a name and id attribute
- <input type="text" name="record_id" id="record_id" />
The Client Script will hold the getRecordId() function that is called via the onclick on the button element. This will place the record sys_id in the hidden input element
- var recordItem = gel('record_id');
  function getRecord(recID){
  recordItem.value = recID;
  }
The Process Script will do the job the client script did before. I used the .get() method to grab the record directly instead of running a query since we have the sys_id already and will just delete the record. And finally use the GlideSession() method to grab where we're at and use the sendRedirect to drop us right back on the page refreshing it.
- var gr= new GlideRecord('incident');
  gr.get(record_id);
  if(gr){
  gr.deleteRecord();
  }
  var urlOnStack = GlideSession.get().getStack().bottom();
  response.sendRedirect(urlOnStack);

The modified HTML markup from steps 1-3 is below. My proposed changes are bolded:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

<g2:evaluate var="jvar_inc">
var inc = new GlideRecord('<table name');
inc.orderBy('u_position');
inc.query();
</g2:evaluate>

<g:ui_form>

<table class="a2_table">
<tr>
<th class="a2_th"><h4><b>abc</b></h4></th>
<th class="a2_th"></th>
<th class="a2_th"><h4><b>Levels</b></h4></th>
<th class="a2_th"></th>
<th class="a2_th"><h4><b>xyz</b></h4></th>
<th class="a2_th" style="width:150px;"><a href="tablename.do"><button class="button" style="width:100%; font-size:50%;" ><h4><b>Add Level</b></h4></button></a> </th>
</tr>

<j2:while test="$[inc.next()]">

<tr>
<td class="a2_td">
$[inc.columnName.getDisplayValue()]
</td>

<td class="a2_td"><b> $[inc.columnName]<br/></b> Description: $[inc.columnName] <br/>Frequency: $[inc.columnName] <br/>
<a href="home.do?sysparm_view=$[inc.columnName.getDisplayValue()]">Dashboard</a>

</td>

<td class="a2_td">
$[inc.columnName.getDisplayValue()]</td>

<!--button style="width:95%; color:#1E90FF;" type="Submit" onClick="deleteFunction('$[inc.sys_id]');"><b>Delete</b>

</button><br/-->

<button type="submit" onclick="getRecord('$[inc.sys_id]')">Delete</button><br/>

</td>
</tr>
</j2:while>
</table>

</g:ui_form>

</g2>

</j:jelly>

View solution in original post

bernyalvarado · ‎10-07-2015

Hi Jennifer, have you checked if the records are actually getting deleted on the server? Since you have the GlideRecord on the client side I have a hunch that these are not getting deleted.

My recommendation will be to build a script include which takes care of deleting the record based on the record's sys_id and class this delete method from the client using a GlideAjax

Thanks,

Berny

jenny32 · ‎10-07-2015

Hi Berny,

When I tried with "window.reload();" in my client script, record is getting deleted from the server when I click on "delete" button but I have to manually refresh the page then only the effect is getting reflected in my UI page.

But what I want is when I click on delete button in my ui page, record should get deleted and should reflect in my UI page also.

bernyalvarado · ‎10-07-2015

Hi Jennifer, would you mind sharing your UI page to see and troubleshoot what you're doing?

Thanks,

Berny

bernyalvarado · ‎10-07-2015

btw... I will perhaps try navigating again to the UI page by perhaps doing a:

window.location.href = "/ui_page.do";

Thanks,

Berny