jqGrid:使用“单元格编辑”编辑多个单元格

时间:2012-12-14 12:38:33

标签: javascript jquery jqgrid

我有问题。我正在使用jqGrid的单元格编辑。我不希望为内联编辑更改它,因为我需要保持这种方式,只允许一次编辑一个单元格。

问题是我有一个字段,在编辑后,需要强制编辑其他单元格。因此,如果用户将第一个单元格更改为某个值,我需要打开这些单元格进行编辑。

有没有办法做到这一点?我尝试过.jqGrid('editCell',...),但这样我一次只能用一个单元格做到这一点。我不能要求下一个必须编辑的单元格来强制编辑第3个和最后一个,因为可能会发生用户想要单独编辑第二个单元格,这会导致此行为。

有什么办法吗?

由于

UPD

为了说明这一点,我举一个例子。假设你有一张桌子,列出你附近的人有的汽车。它有4个单元格:

ID - CarCompany - 型号 - 年

如果ID是一些识别字段,CarCompany是制造汽车的公司的名称,Model是模型的名称,Year是年份的模型。

例如,您有以下记录:

0 - 福特 - 焦点 - 2010

1 - 凯迪拉克 - Escalade - 2004

2 - 兰博基尼 - 暗黑破坏神 - 2012

车主可以换车。他们可以改变年份,这不应该改变任何其他单元格(因为他们改变了他们当前汽车的新版本的汽车),并且他们可以在同一年将模型更改为另一个。但是如果他们为另一家公司改变他们的汽车,你必须更新模型和年份(让我们假设您必须改变年份)。因此:

  • 如果您更改年份,则这是您必须更改的唯一单元格
  • 如果您更改模型,那是您必须更改的唯一单元格
  • 但如果您更改CarCompany,则必须编辑模型和年份。

1 个答案:

答案 0 :(得分:1)

如果我理解您的问题是正确的,您可以使用afterSaveCell回调或其他更符合您要求的内容(请参阅here)。您可以测试哪个列已修改,并明确调用editCell以建议编辑依赖的单元格。可能您可以使用额外的自定义验证规则(请参阅here)以确保用户确实将依赖单元格修改为正确的值。

更新The demo显示了如何在editCell回调中调用afterSaveCell来实现您需要的行为。下面将介绍演示代码中最重要的部分:

var carCompanyEditingMode = false;

$("#list").jqGrid({
    ...
    afterSaveCell: function (rowid, cellname, value, iRow, iCol) {
        var $this = $(this), editedColName = this.p.colModel[iCol].name;
        if (editedColName === "carCompany") {
            setTimeout(function () {
                $this.jqGrid("editCell", iRow, iCol + 1, true);
            }, 50);
            carCompanyEditingMode = true;
            return;
        }
        if (carCompanyEditingMode && editedColName === "model") {
            setTimeout(function () {
                $this.jqGrid("editCell", iRow, iCol + 1, true);
            }, 50);
            return;
        }
        if (carCompanyEditingMode && editedColName === "year") {
            carCompanyEditingMode = false;
        }
    },
    beforeSelectRow: function () {
        // don't allow editing of another row if 
        // the carCompanyEditingMode is true
        return !carCompanyEditingMode;
    },
    afterRestoreCell: function (rowid, value, iRow, iCol) {
        var $this = $(this);
        if (carCompanyEditingMode) {
            // continue editing of the same cell
            setTimeout(function () {
                $this.jqGrid("editCell", iRow, iCol, true);
            }, 50);
        }
    }

});