jQuery Grid Plugin - jqGrid

Gurus,

Please help me resolve this error. I am using jqGrid for the first

time and not able to resolve this error. I am trying to

get InlineEdit work with Latest release of jqGrid. I downloaded

the pack 2 weeks back and since then trying to make this error

go away with no success. Please help me get rid of the error.

 I am posting my code here. I am using PHP for my server side

technology.

<link type="text/css" rel="stylesheet" 

href="../js/jqgrid/themes/jqModal.css" />
<link type="text/css" rel="stylesheet" 

href="../js/jqgrid/themes/basic/grid.css" />

 
<script src="../js/jqgrid/jquery.js" 				type="text/javascript"></script>
<script src="../js/jqgrid/jquery.jqgrid.js" 	type="text/javascript"></script>
<script src="../js/jqgrid/js/jqModal.js" 	type="text/javascript"></script>

<script src="../js/jqgrid/js/jqDnR.js" 	type="text/javascript"></script>
<script src="../js/jqgrid/js/grid.celledit.js" 	type="text/javascript"></script>
<script src="../js/jqgrid/js/grid.inlinedit.js"  type="text/javascript"></script>

<script type="text/javascript">
jQuery(document).ready(function(){ 
  jQuery("#OrderList").jqGrid({
    url: "orders_to_tasks_view.php?mode=read",
    datatype: 'xml',
    mtype: 'GET',
    colNames:['Order','Customer Name', 'Br Name', 

                     'Ord Date', 'Del Date', 'Del.To', 'Total', ' '],
    colModel:[ 
      {name:'orderno',  index:'order_no', width:50}, 
      {name:'sname',   index:'sname',  width:180,  

        editable:true, editoptions: {size:30, maxlength: 180}},
      {name:'br_name', index:'br_name',  width:80,  

         editable:true, editoptions: {size:30, maxlength: 180}}, 
      {name:'ord_date', index:'ord_date', width:70}, 
      {name:'delivery_date', index:'delivery_date', 	width:70}, 
      {name:'deliver_to',  index:'deliver_to',width:150, 

         editable:true, editoptions: {size:30, maxlength: 180}},
      {name:'ordervalue',       index:'ordervalue', width:80, 

        align:'right'},
      {name:'emptycell', index:'none', width:20} ],
    pager: jQuery('#orderpager'),
    width:900,
    rowNum:10,
    rowList:[10,20,30],
    sortname: 'id',
    sortorder: "desc",
    viewrecords: true,
    imgpath: "../js/jqgrid/themes/basic/images",
    caption: "Open Sales Orders",
    cellEdit: true,
    cellSubmit: 'remote',
    editUrl: "orders_to_tasks_view.php?mode=save"
  }); 
});  
</script>

<table id="OrderList" class="scroll"></table> 
<div id="orderpager" class="scroll" 

      style="text-align:center;"></div> 

Any help is highly appreciated. I like jqGrid and Thanks a million 

for saving tons of coding effort by having this type of plugin 

for Jquery.

GO.