jqGrid - 如何将布尔检查状态值和实际唯一值都传递给jqGrid中的复选框?

时间:2012-06-11 18:17:46

标签: jquery jqgrid

我有一个包含jqGrid多个实例的JSP页面。该网格的一列具有复选框,表示是否选择了该行。我需要在jqGrid中有一个像普通的HTML一样的复选框 - 一个既有检查/未检查布尔状态又有实际唯一值的那个,如:
 <input type="checkbox" name="vehicle" value="Car" checked="checked" />

在jqGrid中我面临一个限制,其中我只能将一个值传递给复选框。在jqGrid的colModel中我有这个:

colModel:[
    {name:'assign', index:'assign', width:200, editable:true, edittype:'checkbox', formatter:"checkbox", formatoptions:{disabled : false}}
    ]

在将数据传递给我的jqGrid时,我有这样的数据:

var mydata = [
              {assign:"${assignBool}"}
           ];

但是,在colModel []“assign”中设置的值可以是布尔值 确定是否选中了复选框或者它可能是我们要为复选框设置的实际值,以确定选中了哪个复选框。

在传递布尔值时,我可以在显示中正确检查复选框,但无法获取值(唯一标识值)。

将实际唯一值传递给“assign”时,所有复选框都显示所有复选框的错误默认选中状态。

我无法确定如何将复选状态布尔值和复选框的实际唯一值传递给jqGrid中的“assign”行。

我希望能够使用下面的代码遍历整个页面并获取所有复选框的实际唯一值:

$("#editBtn").click(function() {
    var val = [];
    var checkedNames = '';
    $('input:checkbox:checked').each(function(index) {
        val[index] = $(this).val() + ',';
        checkedNames += val[index];
        }
    );  
    alert("Checked check box values: " + checkedNames);
});

如果我将布尔检查状态传递给上面的“assign”,那么我在checkedNames变量中得到的是True / False或Yes / No值的列表,而不是实际值。

是否还有其他人遇到类似问题,或者有没有人解决此问题?对我来说,这似乎是jqGrid的限制,或者我可能不知道jqGrid中的这种功能。在这方面的任何帮助将是真正的赞赏。

1 个答案:

答案 0 :(得分:1)

我经常使用jqGrid管理自定义行为的一件事是将我想要显示的HTML作为文本传递给colModel。因此,不要使用上面列出的edit属性,只需将HTML作为文本发送到服务器的JSON响应中。

jqGrid会将其呈现为HTML,然后您可以使用jQuery管理行为(看起来您很熟悉)。

<强>更新 例如,我想将jQuery Sparklines集成到我的网格中,所以在我服务器上的控制器中(我使用的是ASP.NET MVC),我返回:

return Json(new
{
    total = (int)Math.Ceiling((double)data.Count / rows),
    page = 1,
    records = data.Count,
    rows = (from item in data
            select new
             {
                 id = "GR" + data.IndexOf(item),
                 cell = new object[] 
                 { 
                     item.Name,
                     "<span class=\"inlinesparkline\" values=\"" + item.SparklineData + "\"></span>"
                 }
             }).ToArray()
        });

在我的jqGrid中,此列在colModel中显示为text:

...
colModel: [
    { name: 'Name', index: 'Name' },
    { name: 'Sparkline', index: 'Sparkline', classes: 'sparkcell' }
],
...

现在在我的gridComplete中,我可以使用jQuery使用.sparkcell选择器执行我需要的任何操作:

...
gridComplete: function () {
    $('.sparkcell').sparkline();
},
...