对设计方案这一形式的jqGrid(solution for Design this forms in

2019-06-24 02:35发布

我在使用jqGrid的问题,讨论说明表的问题之前。
我有4个表COSTTYPE,CurrencyUnit,请求,RequestCost。
COSTTYPE表结构

CostId       CostName 
-------      ----------
  1           permit
  2           Warehouse receipt
  3           Warehousing

并请求结构

RequestId         RequestNo     WaybillNo
------------------------------------------
1                    100          120Ac30
2                    101           400CA852

和CurrencyUnit表意象结构:

UnitId    UnitName
------------------
1           Dollar
2           Pound
3           Rial

和CostRequest表意象结构

requestId   CostId  Amount    CurrencyUnitId     Remark
--------------------------------------------------------
1             2        200      3
1             1        400      1

我想在填充页面加载网格如下:

然后用户可以在顶部的文本框输入任何请求,并单击按钮搜索如下: 用户可以对这个请求更改或输入一些成本金额如下: 然后点击保存按钮在数据库中保存。 注:我在首发的jqGrid我可以填写第一网格中的其他两个步骤,我不能implemet。 请帮我 。 感谢所有

Answer 1:

这是一个有点难以对您的问题回答,而无需编写代码为您服务。

为“RequestNo”(具有ID =“requestNo”例如)和“搜索”按钮输入字段可以是简单的控制<fieldset>在网格上。 click “搜索”按钮的处理程序只需调用$("#grid").trigger("reloadGrid", [{page:1}]) 内部网格的定义,你可以使用postData

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);
        }
    }
    ...
});

您可以添加额外的“保存”按钮,将调用$("#grid").jqGrid("saveRow", editingRowId); 保存上一次编辑一行,如果editingRowId不是undefined

重要的是要添加editable: true到要在编辑模式下查看所有列。 如果你想在网格中的所有编辑栏,您可以使用cmTemplate: {editable: true} jqGrid的选项。 它改变了定义列定义的默认值colModel

若要在“CurrencyUnit”列下拉列表中你应该包括在列定义附加属性:

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


文章来源: solution for Design this forms in jqgrid