$(function() {
        $("#flex1").flexigrid({
                url: 'menu_list_script.php',
                dataType: 'json',
                colModel : [
                        {display: 'ID', name : 'menu_id', width : 40, sortable : true, align: 'left'},
                        {display: 'Menu Name', name : 'menu_name', width : 150, sortable : true, align: 'left'},
                        {display: 'Description', name : 'menu_description', width : 150, sortable : true, align: 'left'},
                        {display: 'URL', name : 'menu_url', width : 250, sortable : true, align: 'left'}
                ],
                buttons : [
                        {name: 'Edit', bclass: 'edit', onpress : doCommand},
                        {name: 'Delete', bclass: 'delete', onpress : doCommand},
                        {separator: true}
                ],
                searchitems : [
                        {display: 'Menu Name', name : 'menu_name'},
                        {display: 'Description', name : 'menu_description', isdefault: true},
                        {display: 'URL', name : 'menu_url'}
                ],
                sortname: "menu_id",
                sortorder: "asc",
                usepager: true,//pagination
                title: "Menu Master",
                useRp: true,
                rp: 20,//records per page
                showTableToggleBtn: false,//toggle button for the whole table
                resizable: false,
                width: 700,
                height: 370,
                singleSelect: true
        });
});
function doCommand(com, grid) {
	if (com == 'Edit') {
	$('.trSelected', grid).each(function() {
	var id = $(this).attr('menu_id');
	id = id.substring(id.lastIndexOf('row')+3);
	alert("Edit row " + id);
	});
	} else if (com == 'Delete') {
	$('.trSelected', grid).each(function() {
	var id = $(this).attr('menu_id');
	id = id.substring(id.lastIndexOf('row')+3);
	alert("Delete row " + id);
	});
	}
	}