Re-Expand rows after a page refresh
Re-Expand rows after a page refresh
Hey guys, looking for some help with making my rows auto-expand to the same state they were in after a page refresh is done
I'm using datatables to display data from a number of SharePoint lists using the rest api to pull the data, when a row is expanded then more data is pulled and displayed for the detail, as part of this detail is a Status field which I am allowing the user to click on which opens a SharePoint model dialog edit form where they can edit the value as well as enter a couple other pieces of information
My issue is that when the form is then closed the data showing does not reflect any updates that were made to that Status field, I have considered inline editing but then the user would not have the ability to enter/edit the other fields that are only shown in the dialog box, displaying them inline is not an option as it would clutter the screen, so I am now trying to do a page refresh and automatically re-open any rows that were already open..
Maybe this is too much trouble? Is it possible to automatically close/re-open a row?
Below is my code (hopefully I'm formatting this post correctly for it to display), I am attempting to use the html5 localStorage functionality to save data between page refreshes, my issue comes when I retrieve the data I stored in anOpen after the refresh in the "fnDrawCallback" function... which I'm not sure is proper either
var anOpen = [];
$(document).ready(function() {
var call = $.ajax({
url: "/_vti_bin/ListData.svc/TestRuns?$expand=TestCases,TestSuites",
type: "GET",
dataType: "json",
headers: {
Accept: "application/json;odata=verbose"
}
});
call.done(function (data,textStatus, jqXHR){
var trData = data.d.results;
var oTable = $('#trTable').dataTable({
"bDestroy": true,
"iDisplayLength": 25,
"deferRender": true,
"bStateSave": true,
"fnDrawCallback": function( oSettings ) {
var retrievedObject = localStorage.getItem('anOpenObject');
if (retrievedObject != null)
{
openObject = retrievedObject.split(",");
localStorage.clear('anOpenObject');
$.each( openObject, function ( i, id ) {
$('#'+id+' td:first-child').trigger( 'click' );
} );
}
},
"bJQueryUI": true,
"bProcessing": true,
"aaData": trData,
"aaSorting": [[ 1, "asc" ]],
"aoColumns": [
{
"mData": null,
"sWidth": "15px",
"sClass": "control center",
"sDefaultContent": '<img src="' + sImageUrl + 'details_open.png">'
},
{ "mData": "Id",
"sWidth": "15px"},
{ "mData": "Title",
"sWidth": "50%"},
{ "mData": "Build"},
{ "mData": "Environment"},
//{ "mData": "RunDate"},
{ "mData": "StatusValue"}
],
"aoColumnDefs" : [
{ 'bSortable': false, 'aTargets': [ 0 ] },
{
"fnRender": function ( oObj ) {
return '<a href="#" onclick="openForm(\'EditForm_New\', \'Test Runs\', \'' + oObj.aData["Id"] + '\', \'' + oObj.aData["Title"] + '\');">' + oObj.aData["Title"] + '</a>';
},
"aTargets": [ 2 ]
}
//{
// "fnRender": function ( oObj ) {
// var date = new Date(parseInt(oObj.aData["RunDate"].substr(6)));
// return $.datepicker.formatDate('dd/mm/yy', date);
// },
// "aTargets": [ 5 ]
//}
]
});
//On click to highlight selected row
$("#trTable tbody tr").click( function( e ) {
if ( $(this).hasClass('row_selected') ) {
$(this).removeClass('row_selected');
}
else {
oTable.$('tr.row_selected').removeClass('row_selected');
$(this).addClass('row_selected');
}
});
//On click control for each Test Run row, expand to show details
$('#trTable').on('click','td.control', function () {
var nTr = this.parentNode;
var i = $.inArray( nTr, anOpen );
var nTr = $(this).parents('tr')[0];
var nTds = this;
if ( i === -1 ) {
$('img', this).attr( 'src', sImageUrl + "details_close.png" );
//Grab current row data
var rowIndex = oTable.fnGetPosition( $(nTds).closest('tr')[0] );
var tcData = trData[rowIndex].TestCases.results;
var tsData = trData[rowIndex].TestSuites.results;
var oData = oTable.fnGetData( nTr );
var currentTestRunID = oData.Id;
var nDetailsRow = oTable.fnOpen(nTr, fnFormatResults(currentTestRunID, oData), 'details');
$('div.innerDetails', nDetailsRow).slideDown();
anOpen.push( nTr );
$('#tabs_' + currentTestRunID).tabs();
//Get details for sub-tables
fnGetRunDetails(currentTestRunID, tcData, tsData);
}
else {
$('img', this).attr( 'src', sImageUrl + "details_open.png" );
$('div.innerDetails', $(nTr).next()[0]).slideUp( function () {
oTable.fnClose( nTr );
anOpen.splice( i, 1 );
});
}
} );
});
call.fail(function (jqXHR,textStatus,errorThrown){
alert("Error retrieving Test Runs: " + jqXHR.responseText);
});
});