lastSel = "";

$(function(){

var myGrid = jQuery("#list");

console.log(myGrid);

$("#list").jqGrid({

url:'php.scripts/customers.get.php',

datatype: 'xml',

mtype: 'POST',

colNames:['idcustomers','firstname', 'lastname','address1','address2','city','state','zip','phone','email','cell'],

colModel :[

{name:'idcustomers', index:'idcustomers', width:55},

{name:'firstname', index:'firstname', width:90, editable: true},

{name:'lastname', index:'lastname', width:90, editable: true},

{name:'address1', index:'address1', width:90, editable: true},

{name:'address2', index:'address2', width:90, editable: true},

{name:'city', index:'city', width:90, editable: true},

{name:'state', index:'state', width:90, editable: true},

{name:'zip', index:'zip', width:90, editable: true},

{name:'phone', index:'phone', width:90, editable: true},

{name:'email', index:'email', width:90, editable: true},

{name:'cell', index:'cell', width:90, editable: true}

],

pager: '#pager',

rowNum:20,

rowList:[20,100,300],

sortname: 'idcustomers',

sortorder: 'asc',

shrinkToFit: true,

viewrecords: true,

gridview: true,

caption: 'Customers',

width: 1400,

height: 290,

editurl: 'php.scripts/jqgrid.updaterow.php',

ajaxGridOptions: {type:"POST"},

onSelectRow: function(id){

if(id && id!==lastSel){

jQuery('#list').restoreRow(lastSel);

lastSel=id;

jQuery("#list").data('selid',lastSel);

console.log(lastSel);

console.log(jQuery("#list").data('selid'));

$.ajax({

type: "POST",

url: "php.scripts/customers.setid.php",

data: { idcustomers: jQuery("#list").data('selid') }

}).done(function( msg )

{

console.log(msg);

});

jQuery('#list').data('selid', jQuery("#list").getCell(lastSel,0));

jQuery('#list').data('firstname', jQuery("#list").getCell(lastSel,1));

jQuery('#list').data('lastname', jQuery("#list").getCell(lastSel,2));

jQuery('#list').data('address1', jQuery("#list").getCell(lastSel,3));

jQuery('#list').data('address2', jQuery("#list").getCell(lastSel,4));

jQuery('#list').data('city', jQuery("#list").getCell(lastSel,5));

jQuery('#list').data('state', jQuery("#list").getCell(lastSel,6));

jQuery('#list').data('zip', jQuery("#list").getCell(lastSel,7));

jQuery('#list').data('phone', jQuery("#list").getCell(lastSel,8));

jQuery('#list').data('email', jQuery("#list").getCell(lastSel,9));

jQuery('#list').data('cell', jQuery("#list").getCell(lastSel,10));

}

}

})

.jqGrid('navGrid','#pager',{ edit: false, add: true, search: false }, {}, {}, {}, {}, {})

.jqGrid('inlineNav',"#pager",{})

.jqGrid('navButtonAdd',"#pager",{caption:"Toggle",title:"Toggle Search Toolbar", buttonicon :'ui-icon-pin-s',

onClickButton:function(){

myGrid[0].toggleToolbar()

}

})

.jqGrid('navButtonAdd',"#pager",{caption:"Clear",title:"Clear Search",buttonicon :'ui-icon-refresh',

onClickButton:function(){

myGrid[0].clearToolbar();

jQuery('#list').data('selid', "");

jQuery('#list').data('firstname', "");

jQuery('#list').data('lastname', "");

jQuery('#list').data('address1', "");

jQuery('#list').data('address2', "");

jQuery('#list').data('city', "");

jQuery('#list').data('state', "");

jQuery('#list').data('zip', "");

jQuery('#list').data('phone', "");

jQuery('#list').data('email', "");

jQuery('#list').data('cell', "");

}

})

.jqGrid('filterToolbar');

/***********************************************************

*********************jqgrid*********************************

***********************************************************/