在jqGrid单元格中检测复选框事件 [英] Detecting checkbox event in jqGrid cell

问题描述

我在我的学习之旅 javascript 和 jQuery 中探索 jqGrid code>，并且我在一个网格单元格中放置一个复选框，真棒！

I'm exploring jqGrid in my journey of learning javascript and jQuery and I manged to put a checkbox in a grid cell, awesome!

have：

$("#myTable").jqGrid({
  colModel:[
     name:'cb', index:'cb', width:40, sorttype:"text", align:"center",
     edittype:"checkbox", editoptions:{value:"Yes:No"}, formatter: "checkbox",
     formatoptions: {disabled : false}},
     other stuff...
  ]

当单击复选框时，如何捕获事件并确定相应的行数据？

When a checkbox is clicked, how do I catch the event and determine the corresponding row data?

复选框是客户端底层数据更新（cb字段切换为是/否）？如何实现这一点？

Also, when I click the checkbox is the underlying data on the client side updated (does the cb field switch "Yes"/"No")? How do I achieve this?

推荐答案

首先，不应使用'cb'作为列的名称是保留列名称。其他两个保留的列名称是'subgrid'和'rn'。

First of all you should not use 'cb' as the name of the column because it is reserved column name. Other two reserved column names are 'subgrid' and 'rn'. Just use any other name if you don't want to have strange problems.

您必须绑定点击才能使用任何其他名称。事件手动添加到事件处理程序。

You have to bind the click event manually to your event handler. To do this you have some options.

您可以点击到<$ c $里面的所有复选框c> loadComplete 回调。请参见答案，其中使用jQuery枚举所有复选框。 另一个答案显示了一个更有效的方法，使用< table> ，< tr> 和< td> 支持已本地实现 rows 和 cells 集合。因此，您可以通过访问< td> this.rows [iRow] .cells [iCol] c $ c> loadComplete 。

You can bind click to all checkboxes inside of the loadComplete callback. See the answer where are used jQuery to enumerate all checkboxes. Another answer shows a little more effective way which use the fact that DOM of <table>, <tr> and <td> supports already native implemented rows and cells collections. So you can access <td> by this.rows[iRow].cells[iCol] inside of loadComplete.

另一种方法是使用 custom formatter 而不是 formatter：'checkbox'并使用 onclick 属性。

One more way will be to use custom formatter instead of formatter: 'checkbox' and use onclick attribute for binding.

UPDATED ：如果您在网格中使用本地数据手动对应的值。请参见答案。它描述了如何使用 getLocalRow 或使用 data 和 _index

UPDATED: If you use local data in the grid you have to update the corresponding value manually. See the answer for example. It describes how to use getLocalRow or use data and _index internal parameters of jqGrid.

要获取用户点击的行的 id ，您可以使用 target 当前事件 $（e.target）.closest（tr。 jqgrow）。attr（'id'）。

To get id of the row on which the user clicked you can use target of the current event $(e.target).closest("tr.jqgrow").attr('id').

这篇关于在jqGrid单元格中检测复选框事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！