Question

使用jqGrid 4.5.2＆amp;尝试根据需要放置下拉框或按钮（取决于行数据中的值）。我存储在页面＆amp;中的变量中的下拉框的内容。在自定义格式化程序中分配它。下拉框如下：

<select id="rlist" class="choices" name="rlist">
<option value="0" disabled="disabled" selected="selected">Select Message</option>
<option value="7">Message2</option>
<option value="8">Message3</option>
<option value="9">Message4</option>
<option value="10">Message5</option>
</select>

按钮的代码是：

"<input name='reviewedBtn' class='cbox' style='height:90%;width:60%' type='submit' value='Reviewed' />";

我正在以XML格式检索以下数据＆amp;在jqGrid中显示它。

<Rowset>
<Row>
<msgTxt>Test Message3</msgTxt>
<SendTime>2013-06-18T15:05:59</SendTime>
<pID>4</pID>
</Row>
<Row>
<msgTxt>Test Message2</msgTxt>
<SendTime>2013-06-18T13:01:46</SendTime>
<pID>4</pID>
</Row>
<Row>
<msgTxt>Test Message1</msgTxt>
<SendTime>2013-06-18T09:22:49</SendTime>
<pID>3</pID>
</Row>
<Row>
<msgTxt>Test Message0</msgTxt>
<SendTime>2013-06-18T08:59:38</SendTime>
<pID>1</pID>
</Row>
</Rowset>

jqGrid本身只显示msgTxt和SendTime字段（pID是隐藏字段）。网格中将有第三列，用于下拉/提交按钮。对于pID = 4的行 - 这些行应显示每个行的下拉框。 pID = 3的行应显示submit按钮。 pID = 1应该在第3列中没有显示任何内容。以下是我的colModel的简化版本。

colModel:[
    {name:"SendTime",index:"SendTime",width:col1width,align:"center",formatter:"date",formatoptions: {"srcformat":"ISO8601Long", "newformat":"Y-m-d H:i:s"},xmlmap:"Rowset>Row>SendTime",sortable:false},
    {name:"msgTxt",index:"msgTxt",width:col2width,align:"left",xmlmap:"Rowset>Row>msgTxt",sortable:false},
    {name:"action",
        width:col3width,
        align:"center",
        title:false,
        formatter: function(cellvalue, options, rowObject) {
                var pri = $(rowObject).find("pID").text();
                if (pri === "4") {
                    return msgSelect;
                    }
                if (pri === "3") {
                    return "<input name='reviewedBtn' class='cbox' style='height:90%;width:60%' type='submit' value='Reviewed' />";
                    }
                else {
                    return ""
                    }
                }
        },
    {name:"pID",index:"pID",width:col4width,align:"left",xmlmap:"Rowset>Row>pID",sortable:false, hidden:true}
    ],

我在beforeSelectRow中有以下代码来捕获开头和＆amp;更改下拉框。

beforeSelectRow: function(id, e) {
    var $self = $("#myGrid");
    var $td = $(e.target).closest("td");
    var iCol = $.jgrid.getCellIndex($td[0]);
    var name = $(e.target).attr("name");
    if (this.p.colModel[iCol].name === "action") {
        if (name === "rlist") {
            selected = $(this).val();
            console.log("responselist open);
        $("#rlist").change(function(){
                var ritem = $(this[this.selectedIndex]).val();
                var ritemtext = $(this[this.selectedIndex]).text();
                console.log("response list changed " + ritemtext +  "   id = " + id);

                return false;
                });// response list changed
            return false;
        } // if rlist
        if (name === "reviewedBtn") {
            console.log("reviewedBtn clicked");
            return false;
            } // if reviewedBtn selected
    } // if Action Column
    return false;
}, // beforeSelectRow

在上面的数据示例中，对于第1行，下拉列表应该正常运行 - 我检测到下拉列表的打开和更改。但是，如果我在第2行上打开下拉列表，它会检测下拉列表的打开，但在选择完成后，下拉菜单中的更改事件永远不会出现。（注意：我删除了一些刷新网格的代码，以简化我发布的代码。但是，我在console.log语句的位置跟踪我应该发生的事情。

到目前为止，我所看到的jqGrid的所有例子都涉及编辑数据，我没有这样做。我相信我在自定义格式化程序中做错了什么，但我不知道是什么。我将不胜感激任何帮助或建议如何解决这个或如何错误地解决这个问题。

谢谢！

Answer 1

我最终解决了自己的问题，最后发现自定义格式化程序并没有任何问题。它在做什么。我重新构建了beforeSelectRow，如下所示：

beforeSelectRow: function(id, e) {
    var $self = $("#myGrid");
    var $td = $(e.target).closest("td");
    var iCol = $.jgrid.getCellIndex($td[0]);
    var name = $(e.target).attr("name");

    if (name === "reviewedBtn") {
       console.log("reviewedBtn clicked");
       return false;
       } // if reviewedBtn selected

    if (($(e.target).val() !== null) && ($(e.target).val() !== "Reviewed")) {
    var ritem = $(e.target).val();
    var ritemtext = $(e.target).text(); 
    console.log("response list changed " + ritemtext +  "   id = " + id);   
    return false;
       }    


    if (this.p.colModel[iCol].name === "action") {
        if (name === "rlist") {
            selected = $(this).val();
            console.log("responselist open);
            return false;
        } // if rlist
    } // if Action Column
    return false;
}, // beforeSelectRow

我需要确定responselist何时打开（我用它来停止间隔，这里为了简单起见省略了）＆amp;然后会在点击按钮或下拉列表进行选择时捕获。

上面的代码能够做到这一点。

jqGrid - 每行中的绑定下拉列表或按钮

1 个答案: