jQuery Grid Plugin - jqGrid

I'm getting the same error in firebug. 

I am trying to save edited field data to an xml file after hitting the submit button, but the page just hangs and give the 'formoptions not defined' error. 

I've looked into the 'formoptions' options but I don't want to "reorder the elements in the form and to add some information before and after the editing element".  I just am looking to change the data and save it to my DummData.xml as a string.

Here is the code.

<%@ include file="/WEB-INF/jsp/include.jsp" %>

<link rel="stylesheet" type="text/css" media="screen" href="../decorations/layout/smoothness/jquery-ui-1.8.1.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="../decorations/layout/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="../decorations/layout/help.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script type='text/javascript' src='http://ajax.googleapis.com/aja.....pt&gt;
<script type="text/javascript" src="../javascript/otherIncludes/i18n/grid.locale-en.js"></script>
<script type="text/javascript" src="../javascript/otherIncludes/jquery.jqGrid.min.js"></script>

<script type="text/javascript">
jQuery(document).ready(function(){
  jQuery("#list").jqGrid({
    url:'../javascript/otherIncludes/DummyData.xml',
       datatype: "xml",
        mtype: 'GET',
    colNames:['Time','Patient', 'Pharmacist','Notes','Status'],
    colModel :[
               {name:'Time', index:'Time', width:80, align:'center',editoptions:{readonly:true,size:10}},
               {name:'Patient', index:'Patient', width:50, align:'center', editable:true,editoptions:{size:10}},
               {name:'Pharmacist', index:'Pharmacist', width:50, align:'center', editable:true,editoptions:{size:25}},
               {name:'Notes', index:'Notes', width:50, align:'center', editable:true, edittype:"textarea", editoptions:{rows:"2",cols:"20"}},
               {name:'Status', index:'Status', width:50, align:'center', editable:true,edittype:"select",editoptions:{value:"Booked:Booked;Complete:Complete;Deferred:Deferred"}},
          
                          ],
    pager: jQuery('#pager'),
    rowNum:16,
    viewrecords: true,
    editurl: "../javascript/otherIncludes/DummyData.xml",
    caption: 'Appointment Schedule For DD/MM/YYYY',
       xmlReader : {
           root: "Rows",
           row: "row",
           page: "Rows>page",
           total: "Rows>total",
           records : "Rows>records",
           repeatitems: true,
           cell: "cell"
               },  

             
  });
  $("#bedata").click(function(){
              var gr = jQuery("#list").jqGrid('getGridParam','selrow');
              if( gr != null ) jQuery("#list").jqGrid('editGridRow',gr,{height:280,reloadAfterSubmit:true},);
              else alert("Please Select Row"); });

}); 
</script>
 <script type="text/javascript">
    $(function() {
        $("#datepicker").datepicker();
    });
    </script>
    
<br><br>
<h1>Appointments For Which Day?2</h1>
<form name="form1″ action="" method="post">
<input type="text" id="datepicker"><input name="Submit" type="submit" value="Submit">
</form>
<br>

<table id="list" class="centerTable" ></table>
<div id="pager"></div>
<input type="BUTTON" id="bedata" value="Edit Selected Row" />

Thanks for any and all help!

==UPDATE==

Nevermind guys im passed this issue.  I just set some formoptions to see what happened and formoptions actually controls the display of the form, not the grid as I thought. 

So no more formoptions not defined errors, but still having problems... my submit button in the form does nothing, literally. 

Thanks anyway guys and gals.