jquery - PHPのjQuery Flexigridで行を追加、編集、削除するには?

Question

jQuery Flexigrid を使用しています。Flexigrid をサポートするのに十分なドキュメントが見つかりません。グリッドにボタンを追加しました。ボタンをクリックしても、追加/編集フォームを取得できませんでした。私のコードは次のとおりです。

<script type="text/javascript">
    var $nf = jQuery.noConflict();
</script>

フレキシグリッドコード

colModel : [{display: 'Sub Sub Category Code', name : 'sub_sub_category_code', width : 170, sortable : true, align: 'left'},
            {display: 'Category Code', name : 'category_code', width : 110, sortable : true, align: 'left'},
            {display: 'Sub Category Code', name : 'sub_category_code', width : 140, sortable : true, align: 'left'},
            {display: 'Sub Sub Category Name', name : 'sub_sub_category_name', width : 170, sortable : true, align: 'left'},
            {display: 'Status', name : 'status', width : 48, sortable : true, align: 'left'}
           ],
buttons  : [{name: 'Add', bclass: 'add', onpress : test},
            {name: 'Edit', bclass: 'edit', onpress : test},
            {name: 'Delete', bclass: 'delete', onpress : test},{separator: true}
           ],

追加・編集・削除のjQueryコード

function getid(com,grid){
    var id='';
    $('.trSelected', grid).each(function() {
        id = $(this).attr("id");
        id = id.substring(id.lastIndexOf('row')+3);
    });
    alert(id);
    return id;
}
$nf(document).ready(function(){
    //Define configuration object
    var dialogAdd = {
         modal: true,
         bgiframe: true,
         autoOpen: false,
         height: 370,
         width: 640,
         draggable: true,
         resizeable: true,
         open: function(com,grid) {
             //Display correct dialog content
             $("#formadd").load("../FlexiAdd.php");
         }
    };
    $nf("#formadd").dialog(dialogAdd); //End dialog
    var dialogEdit = {
         modal: true,
         bgiframe: true,
         autoOpen: false,
         height: 370,
         width: 640,
         draggable: true,
         resizeable: true,
         open: function(com,grid) {
             //Display correct dialog content
             $("#formedit").load("../FlexiAdd.php?id="+getid()+"");
         }
    };
    $nf("#formedit").dialog(dialogEdit); //End dialog
});

function test(com,grid)
{
    if (com=='Delete')
    {
        if($('.trSelected',grid).length>0){
            if(confirm('Delete ' + $('.trSelected',grid).length + ' items?')){
                var items = $('.trSelected',grid);
                var itemlist ='';
                for(i=0;i<items.length;i++){
                    itemlist+= items[i].id.substr(3)+",";
                }
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "delete.php",
                    data: "items="+itemlist,
                    success: function(data){
                        alert("Query: "+data.query+" - Total affected rows: "+data.total);
                        $(".sub_sub_category").flexReload();
                    }
                });
            }
        } else {
             return false;
        }
    }
    else if (com=='Add')
    {
        $nf("#formadd").dialog('open');
    }
    else if (com=='Edit')
    {
        if($('.trSelected',grid).length>0){
            $nf("#formedit").dialog('open');
        }
        else {
            return false;
        }
    }
}

HTMLコード

<table class="sub_sub_category" id="sub_sub_category" style="display: none"></table>

<br /><br />

<div id="formadd" style="display:none" title=""></div>
<div id="formedit" style="display:none" title=""></div>

私が確信していないことの 1 つは、私の jQuery が正しいかどうかです。私はjQueryの初心者なので、2日間修正しようとしましたが、Flexigridの十分なドキュメントが見つからず、修正できませんでした. この問題を解決するにはどうすればよいですか?