如何重新填充表单提交使用jQuery隐藏的CSV字段

 
<form> 

    <input type="checkbox" id="01" name="01" /> 
    <input type="checkbox" id="02" name="02" /> 
    <input type="checkbox" id="03" name="03" /> 

    <input type="hidden" value="03,01," /> 

</form>

我有上面的表格;使用下面的代码在页面完成加载时勾选复选框01和03。如何重新填充表单提交使用jQuery隐藏的CSV字段

我现在需要确保当复选框的值发生变化时，隐藏的CSV字段也会发生变化（尽管当表单提交时可能会这样做）。我认为使用创建的变量，应该可以在表单提交时重新填充CSV字段。即使用selected_ids将复选框的id添加到CSV的末尾（如果它们尚不存在）。这可以做到吗？

var csvValue = $('#csv-input').val(); 
var selected_ids = csvValue.split(','); 
for (var i = 0; i < selected_ids.length; i++) 
{ 
    var selected_id = selected_ids[i]; 
    $('#' + selected_id).attr('checked', 'checked'); 
}

一些善良的人给了我这个代码在我刚才的问题：

 
$(':checkbox').bind('change', function(event){ 
    if (this.checked == true){ 
     // add to hidden field 
     var tempIdStr = $('#cvs-input').val(); 
     // if not in hidden value already 
     if (tempIdStr.indexOf(this.id) > -1){ 
      tempIdStr += "id,"; // or ", id" depending on how you are seperating the ids 
     $('#cvs-input').val(tempIdStr); 
     } 
    } else { 
    // remove from hidden field 
     var tempIds = $('#cvs-input').val().split(','); 
     var index = tempIds.indexOf(this.id); 
     if (index > -1){ 
      tempIds.splice(index, 1); 
      $('#cvs-input').val(tempIds.join(','); 
    } 
});

我认为这是接近，但还没有应用。任何进一步的帮助将是非常好的，在此先感谢。

来源

2010-11-25 CherryFlavourPez

请记住，以数字开头的ID无效并可能导致问题。 – RoToRa 2010-11-25 11:59:20

你可以建立从元素属性简明使用.map一个CSV：

$(":checkbox").change(function() { 
    var csv = $(":checkbox:checked").map(function() { 
     return this.id; 
    }).get().join(","); 
    alert(csv); 
    $("input:hidden").val(csv); 
});

演示：http://jsfiddle.net/karim79/tqAnX/2/

作为一个侧面说明，元素ID不应该以数字开始。

来源

2010-11-25 11:15:34 karim79

+1 - 需要注意的是，ID号限制是HTML4特有的，而不是HTML5 :) – 2010-11-25 11:29:12

如何重新填充表单提交使用jQuery隐藏的CSV字段

回答

相关问题