WordPress id confilct with JqGrid?

Hi I’m trying to use jqgrid with WordPress and everything seems to be working fine except that I can’t get my data to line up properly (column headers to data) in the grid. It appears that the id of the grid is somehow conflicting with wordpress but I’m not sure?
I am unable to populate the id column.

When I implement the jqGrid outside of wordpress the data aligns properly and the id column is populated.

Images and code here.
https://tinyurl.com/pw6qf6s

The json returned from my php page is:

{"page":"1","total":1,"records":"2","rows":[{"id":"2","cell":["2","babolat2","racquet","eqid2","description"]},{"id":"1","cell":["1","wilson 6.1","racquet","eqid","description"]}]}

$(document).ready(function(){
jQuery("#list2").jqGrid({
   	url:'src/view_reservations.php',
	datatype: "json",
   	colNames:['ID','Equipment Name', 'Equipment Type', 'Equipment ID','Equipment Description'],
   	colModel:[
               	{name:'id',index:'id', width:20,sorttype:'int',key:true},
   		{name:'equipment_name',index:'equipment_name', width:90},
   		{name:'equipment_type',index:'equipment_type', width:100},
                {name:'equipment_id',index:'equipment_id', width:75},
                {name:'equipment_description',index:'equipment_description', width:100}
   	],
   	rowNum:10,
   	rowList:[10,20,30],
   	pager: '#pager2',
   	sortname: 'id',
    height: 255,
	width: 800,
    viewrecords: true,
    sortorder: "desc",
    caption:"Player List"
});
jQuery("#list2").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false});
});

Thanks!