solution for Design this forms in jqgrid

Question

I Have problem in use jqGrid,Before discussing the question of explain tables.
i have 4 tables CostType,CurrencyUnit , Request,RequestCost .
CostType Table structu

Answer 1

It's a little difficult to answer on your question without writing the code for you.

The input field for "RequestNo" (having id="requestNo" for example) and the "Search" button could be simple controls in <fieldset> over the grid. click handler of the "Search" button can just call $("#grid").trigger("reloadGrid", [{page:1}]). Inside of grid definition you can use postData like

var $grid = $("#grid"),
    editingRowId,
    myEditParam = {
        keys: true,
        oneditfunc: function (id) { editingRowId = id; },
        afterrestorefunc: function (id) { editingRowId = undefined; },
        aftersavefunc: function (id) { editingRowId = undefined; }
    }; 

$grid.jqGrid({
    ...
    postData: {
        // add requestNo parameter to the request
        requestNo: function () { return $("#requestNo").val(); }
    },
    beforeRequest: function () {
        // stop request to the server for empty requestNo
        return $("#requestNo").val() !== "" ? true : false;
    },
    onSelectRow: function (id) {
        if (id !== editingRowId) {
            if (typeof editingRowId !== "undefined") {
                // save previously editing row
                $(this).jqGrid("saveRow", editingRowId, myEditParam);
            }
            // start inline editing. The user should save the row by pressing ENTER
            $(this).jqGrid("editRow", id, myEditParam);
        }
    }
    ...
});

You can add additionally "Save" button which would call $("#grid").jqGrid("saveRow", editingRowId); to save the last editing row if editingRowId is not undefined.

It is important to add editable: true to all columns which you want to see in editing mode. If you want to have all editing columns in the grid you can use cmTemplate: {editable: true} jqGrid option. It changes the defaults for column definitions defined in colModel.

To have dropdown in the "CurrencyUnit" column you should include additional properties in the column definition:

edittype: "select", editoptions: { value: "Dollar:Dollar; Pound:Pound; Rial:Rial" }