Showlink de mise en forme personnalisée avec l'ancre et de l'image dans jqgrid

J'ai une mise en forme personnalisée de showlink qui ouvre une nouvelle page ci-dessous est le code et la capture d'écran

{name:'cfgName',index:'cfgName', width:90, align:"left", formatter: 'showlink', formatoptions:
                                                                            {
                                                                                baseLinkUrl:'javascript:',
                                                                                showAction: "goToViewAllPage('",
                                                                                addParam: "');"

                                                                            }},

Ce que je veux, c'est si la différence de Last Updated time et la date d'aujourd'hui est de plus de 10 jours, il devrait afficher une warning image avant de la Name

J'ai écrit ci-dessous la fonction de de calculer la différence entre 2 dates, voici la démo pour ça, mais j'ai besoin d'aide dans le placement des images en face de showlink noms, si le no of days count > 10 dans la grille

function diffOf2Dates(todaysDate,configDate)
{
/*var udate="2011-08-18 11:49:01.0";
var configDate=new Date(udate);*/

var oneDay = 24*60*60*1000; //hours*minutes*seconds*milliseconds
var firstDate = todaysDate; //Todays date
var secondDate = new Date(configDate);

var diffDays = Math.abs((firstDate.getTime() - secondDate.getTime())/(oneDay));
console.info(firstDate+", "+secondDate);
//console.info(Math.ceil(diffDays));

return Math.ceil(diffDays);
}

Voici mon jqGrid code

var grid = jQuery("#list1");
grid.jqGrid({
datastr : xml,
datatype: 'xmlstring',
colNames:['cfgId','Name', 'Host', 'Description','Product', 'Type', 'Last Updated Time','Last Updated By','',''],
colModel:[
{name:'cfgId',index:'cfgId', width:90, align:"left", hidden:true},
//{name:'updateDate',index:'updateDate', width:20, align:'center', formatter: oldConfigurationWarning },
{name:'cfgName',index:'cfgName', width:90, align:"left", formatter: 'showlink', formatoptions:
{
baseLinkUrl:'javascript:',
showAction: "goToViewAllPage('",
addParam: "');"
}},
{name:'hostname',index:'hostname', width:90, align:"left"},
{name:'cfgDesc',index:'cfgDesc', width:90, align:"left"},
{name:'productId',index:'productId', width:60, align:"left"},
{name:'cfgType',index:'cfgType', width:60, align:"left"},
{name:'updateDate',index:'updateDate',sorttype:'Date', width:120, align:"left"},
{name:'emailAddress',index:'emailAddress', width:120, align:"left"},
{name:'absolutePath',index:'absolutePath', width:90, align:"left", hidden:true},
{name:'fileName',index:'fileName', width:90, align:"left", hidden:true},
],
pager : '#gridpager',
rowNum:10,
rowList:[10,50,100],
scrollOffset:0,
height: 'auto',
emptyrecords: 'No configurations loaded',
autowidth:true,
viewrecords: true,
gridview: true,
multiselect: true,
xmlReader: {
root : "list",
row: "Response",
userdata: "userdata",
repeatitems: false
},
loadComplete: function () {
var count = grid.getGridParam();
var ts = grid[0];
if (ts.p.reccount === 0) {
grid.hide();
emptyMsgDiv.show();
} else {
grid.show();
emptyMsgDiv.hide();
}
},
onSelectRow: function(id,status){
var rowData = jQuery(this).getRowData(id); 
configid = rowData['cfgId'];
configname=rowData['cfgName'];
configdesc=rowData['cfgDesc'];
configenv=rowData['cfgType'];
absolutepath=rowData['absolutePath'];
/*filename=rowData['fileName'];
updatedate=rowData['updateDate'];
absolutepath=rowData['absolutePath'];*/
updateproductid=rowData['productId'];
$('#cfgid').removeAttr('disabled');
document.getElementById("cfgid").value=configid;
document.getElementById("cfgname").value=configname;
document.getElementById("cfgdesc").value=configdesc;
var element = document.getElementById('cfgenv');
if(configenv=="Production")
element.value = "Production";
else if(configenv=="Development")
element.value="Development";
else
element.value="Test/QA";
rowChecked=1;
currentrow=id;
}
});
grid.jqGrid('navGrid','#gridpager',{edit:false,add:false,del:false});
jQuery("#m1").click( function() {
var s;
s = grid.jqGrid('getGridParam','selarrrow');
alert(s);
});
var myGrid = $("#list1");
$("#cb_"+myGrid[0].id).hide();
//place div with empty message insde of bdiv
emptyMsgDiv.insertAfter(grid.parent());

OriginalL'auteur abi1964 | 2011-08-19