jqGrid单选按钮选择单行 [英] jqGrid Radio Button select single row

问题描述

我每行都有一个带有RadioButton的JqGrid.

I have JqGrid with RadioButton per each row like this.

  ...
 { name: 'select', label: 'select', width: 50, formatter:radio}

和收音机格式化程序的功能:

and function for radio formatter:

function radio(value, options, rowObject){
   var radioHtml = '<input type="radio" value=' + value + ' name="radioid" />';
   return radioHtml;
}

当我尝试从jqgrid i.ee.中选择单行时，单选按钮只能使用此功能进行选择:

when I try to select a singlerow from the jqgrid i.ee., radio button which is only selected using this function:

  $(function () {
   $("#<%=editButton.ClientID%>").click(function () {
       var ids = $("#table").jqGrid('getCol', 'select', true);
       alert(ids)
       for (var i = 0; i < ids.length; i++) {
           //alert(ids[i].id)
           if (ids[i].id != '') {
               var idx = $("#table").jqGrid('getCell', ids[i].id, 'select');
           }
          // alert(idx);
       }
   });
 });

使网格中的所有行都可用，而不是单个选定的行.

Am getting all the rows available in the grid rather than single selected row.

如果格式化程序为复选框，但不适用于收音机，则该功能可以很好地工作.缺少什么吗?

The same function works well if formatter is checkbox but not for radio. Is there something missing?

更新:

   colModel: [
                     { name: 'select', label: 'select', width: 50,
                         formatter: function radio(cellValue, option) {
                             return '<input type="radio" name="radio_' + option.gid +       '"  />';
                         } 
                     },
                     { name: 'code', label: 'Branch Code', width: 250 },
                     { name: 'name', label: 'Branch Name', width: 250 },
                     { name: 'status', label: 'Group Status', width: 250 },
                ],

功能点击处理程序:

     $("#<%=editButton.ClientID%>").click(function () {
            alert('M');
            var $selRadio = $('input[name=radio_' + $table[0].id + ']:checked'), $tr;
            alert('I');
            if ($selRadio.length > 0) {
                $tr = $selRadio.closest('tr');
                if ($tr.length > 0) {
                    alert("The id of selected radio button is " + $tr.attr('id'));
                }
            } else {
                alert("The radio button is not selected");
            }
        });

推荐答案

在我看来，您当前来自$("#<%=editButton.ClientID%>").click的代码过于复杂.您可以以更简单的方式完成所需的工作.

It seems to me that your current code from $("#<%=editButton.ClientID%>").click is too complex. You can do what you need in more simple way.

首先，我建议您使用<radio>按钮的name属性，该属性取决于网格的ID(请参阅

First of all I recommend you to use the name attribute of the <radio> button which is depend on the id of the grid (see the answer). It could be like the following

formatter: function (cellValue, option) {
    return '<input type="radio" name="radio_' + option.gid + '"  />';
}

您可以使用以下代码获取所选单选按钮的ID

You can get the id of selected radio button with the following code

$("#<%=editButton.ClientID%>").button().click(function () {
    var $selRadio = $('input[name=radio_' + $grid[0].id + ']:checked'), $tr;
    if ($selRadio.length > 0) {
        $tr = $selRadio.closest('tr');
        if ($tr.length > 0) {
            alert("The id of selected radio button is " + $tr.attr('id'));
        }
    } else {
        alert("The radio button is not selected");
    }
});

请参见演示，该演示将对此进行演示:

See the demo which demonstrate this:

这篇关于jqGrid单选按钮选择单行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！