<?php
$cs = Yii::app()->clientScript;

$cs->registerCssFile(Yii::app()->request->baseUrl.'/css/jqgrid/ui-lightness/jquery-ui.css');
$cs->registerCssFile(Yii::app()->request->baseUrl.'/css/jqgrid/ui.jqgrid.css');

$cs->registerScriptFile(Yii::app()->request->baseUrl.'/js/jqgrid/jquery-1.4.2.min.js');
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/js/jqgrid/i18n/grid.locale-ru.js');
$cs->registerScriptFile(Yii::app()->request->baseUrl.'/js/jqgrid/jquery.jqGrid.min.js');

?>

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

<script type="text/javascript">
$(document).ready(function(){
    var lastSel;
    jQuery("#list").jqGrid( {
        url : '<?php echo $this->createUrl('manage/getusers'); ?>',
        datatype : 'json',
        mtype : 'GET',
        colNames : [ 'id', 'E-Mail', 'Username', 'Status' ],
        colModel : [ {
            name : 'id',
            index : 'id',
            width : 60,
            searchoptions:{sopt:['eq','ne','bw','cn']}
        }, {
            name : 'email',
            index : 'email',
            width : '100%',
            searchoptions:{sopt:['eq','ne','bw','cn']}
        }, {
            name : 'username',
            index : 'username',
             editable:true,
             edittype: 'text',
            width : 150,
            align : 'right',
            searchoptions:{sopt:['eq','ne','bw','cn']}
        }, {
            name : 'status',
            index : 'status',
            width : 80,
            align : 'right',
            searchoptions:{sopt:['eq','ne','bw','cn']}
        } ],
        pager : '#pager',
        rowNum : 10,
        rowList : [ 10, 20, 30 ],
        sortname : 'id',
        sortorder : 'asc',
        viewrecords : true,
        caption : 'Users',
        width: 800,
        height: "100%",
        ondblClickRow: function(id) {
        if (id && id != lastSel) {
          jQuery("#list").restoreRow(lastSel);
          jQuery("#list").editRow(id, true);
          lastSel = id;
        }
      }

    }).navGrid('#pager',{view:false, del:false, add:false, edit:false},
      {}, // default settings for edit
      {}, // default settings for add
      {}, // delete instead that del:false we need this
      {closeOnEscape:true, multipleSearch:true, closeAfterSearch:true}, // search options
      {} /* view parameters*/
    );
});
</script>