jqGrid HTML Page

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>

<link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

 <script type="text/javascript">
        var lastsel;

        $(function(){
          $("#list").jqGrid({
            url:'example.php',
            datatype: 'xml',
            mtype: 'GET',
            colNames:['Name','Description'],
            colModel :[
              {name:'name', width:250, editable:true},
              {name:'description', width:600, editable:true}
            ],
            pager: '#pager',
            rowNum:8,
            rowList:[10,20,30],
            sortname: 'name',
            sortorder: 'desc',
            viewrecords: true,
            gridview: true,
            caption: 'Sanatorium Database',
            onSelectRow: function(name){
                if(name && name!==lastsel){
                    jQuery('#list').jqGrid('restoreRow',lastsel);
                    jQuery('#list').jqGrid('editRow',name,true);
                    lastsel = name;
                }
            },

            editurl: "edit.php",
          });
        });

        jQuery("#list").jqGrid('navGrid',"#pager",{edit:false,add:false,del:false});


</script>

</head>
<body>
    <h1>Title-Time</h1>

    <table id="list"><tr><td/></tr></table>
    <div id="pager"></div>

</body>