从所有行中获取单击的单选按钮值

时间:2014-02-27 14:11:09

标签: javascript jquery

我有一个有很多行的网格(dhtmlx)。我想要实现的是获取每行的单击单选按钮的所有值加上用逗号分隔的行id并将其放入输入框?行ID和单选按钮值由以下分隔:

行ID以110014742~01~01

格式自动生成

rowId:radioBtnValue,rowId:radioBtnValue,rowId:radioBtnValue

13004238~01~01:02,110012178~01~01:05,110014742~01~01:03 - >单击单选按钮时,在输入框内。

包含所有单选按钮及其标题的列的ID为rbBtn_sel

单击时会有另一个按钮将从输入框中取值并保存。

function DoRowSaveConfig()  {
 var colIndex=mygrid.getColIndexById("rdBtn_sel");
 var radioBtn = mygrid.getCheckedRows(colIndex);
 var  CommaCount = radioBtn.split(",").length - 1 ;
 for (var i= 0; i<radioBtn.length; i++)
 if (radioBtn[i].checked) {
 var selectedVal = radioBtn[i].value;
             document.getElementById('an.ret.sys.4.').value = selectedVal;
             document.getElementById('an.ret.sys.5.').click();
             } 
             }
              return false;
       };

也许Jquery会有更好的解决方案。打开它。

http://jsfiddle.net/19eggs/ep6JE/

How the table/grid structure with column id

/ ********** EDIT ************** /

谢谢大家,它按预期工作,但我可能会误导你。单击单选按钮后,它需要获取行id的值而不是id(第二列)。更新了图片。

行ID以110012178~01~01的格式自动生成。另外我们使用xml和DHTMLX网格会自动转换为表格。

<rows><row id="13004238~01~01"><cell>James Brown</cell>
<cell>12545</cell>
<cell><![CDATA[<div class="rd"><input type="radio" name="130042380101" value="00"></div>
<div class="rd"><input type="radio" name="1100121780101" value="01"></div>
<div class="rd"><input type="radio" name="130042380101" value="02"></div>
<div class="rd"><input type="radio" name="130042380101" value="03"></div>
<div class="rd"><input type="radio" name="130042380101" value="04"></div>
<div class="rd"><input type="radio" name="130042380101" value="05"></div>
<div class="rd"><input type="radio" name="130042380101" value="06"></div>]]>
</cell>
</row>\</rows>'; 

3 个答案:

答案 0 :(得分:2)

这是我的尝试 - 请注意它比地图简单得多,并且假设您只有要在页面上处理的无线电

Live Demo

$(function() {
  $("input[type=radio]").on("click",function() { 
    var clicked = [];
    $("input[type=radio]:checked").each(function() {
        clicked.push($(this).closest("td").prev().text()+"~"+this.value);
    });
    $("#an\\.ret\\.sys\\.4\\.").val(clicked);
  });    
});

如果您需要收音机的名称:

clicked.push(this.name+":"+this.value);

答案 1 :(得分:0)

使用.map()

Fiddle Demo

function DoRowSaveConfig() {
    var arr = $('table').find('input[type="radio"]:checked').map(function () {
        return $(this).closest('tr').find('td:eq(1)').text() + ':' + this.value;
    }).get().join();
    console.log(arr);
};

答案 2 :(得分:0)

使用.map()创建一个带.join()的数组允许您这样做:

function DoRowSaveConfig(){
    var arr = $('tr:not(:first)').map(function(){
        var id = $.trim($(this).find('td').eq(1).text()); //1 == second column
        var value = $(this).find(':checked').val(); //Find the checked one
        return id + ':' + value; //Build an array of strings
    }).get()

    alert(arr.join(', ')); //Join them.
}

http://jsfiddle.net/ep6JE/1/


修改

编辑完成后,此代码工作:

function DoRowSaveConfig(){
    var arr = $('row').map(function(){
        var id = this.id;
        var value = $(this).find(':checked').val(); //Find the checked one
        return id + ':' + value; //Build an array of strings
    }).get()

    alert(arr.join(', ')); //Join them.
}