Skip to content Skip to sidebar Skip to footer

Jquery - Renaming Checkboxes Sets Consecutively

I'm trying to build a form to allow multiple elements (unknown number) to be entered and then processed with PHP. The forms need to be grouped into two columns and my approach has

Solution 1:

var j = 0;

$('[name="UPDATE_METHOD[]"]').prop('name', function(i, name) {
    if (i%2==0) j++;
    return name.split('[').shift() + '['+j+'][]';
});

FIDDLE

Solution 2:

Ive created a fiddle which is a more simple implementation:

HTML:

<div class="group origin">
    <label><inputtype="checkbox"name="UPDATE_METHOD[0][]"value="Email"checked="">Email</label><label><inputtype="checkbox"name="UPDATE_METHOD[0][]"value="SMS"checked="">SMS</label></div><ahref="#"class="cloner">Clone!</a>

Javascript:

var original= $(".origin");
var cloneNum = 0;
$(".cloner").on("click", function(e){
    e.preventDefault();

    cloneChecks();
});

functioncloneChecks(){
    console.log("cloning..."); 
    cloneNum++;
    var clone = original.clone();
    clone.removeClass("origin");
    clone.find("input").each(function(){
        $(this).attr("name", "UPDATE_METHOD[" + cloneNum + "][]");
    });
    original.after(clone);
}

You can tweak this of course to remove the grouping div, but the principle is very easy.

Live example: http://jsfiddle.net/q3n7s/1/

Post a Comment for "Jquery - Renaming Checkboxes Sets Consecutively"