Question

I have a set of Checkboxes on a page which I am getting hold of using JQuery, on a user clicking the checkbox I need the value to be sent to a field which will be hidden and I need each value added to be delimited by a | I have written the following.

        $(document).ready(function() {
        $('input[name="_CKBXprod_link"]').attr("id", "_CKBXprod_link");
           $('input[name="_CKBXprod_link"]').click(function() {
               $('#link_ids').val(this.value+"|");
           });
        });

Simple! 😉 can anyone tell me what I am missing it is adding values but they are replace by each click of a checkbox.

Answer 1

Description

I think what you really want is a input box that holds all your checked
checkboxes uniquely.

Sample

<input type="text" id="link_ids"/>

<input type="checkbox" class="_CKBXprod_link" value="1"/>
<input type="checkbox" class="_CKBXprod_link" value="2"/>
<input type="checkbox" class="_CKBXprod_link" value="3"/>
<input type="checkbox" class="_CKBXprod_link" value="4"/>

$(document).ready(function() {  
    $('._CKBXprod_link').click(function() {
        var checkboxes = $("._CKBXprod_link:checked");
        var values = "";
        checkboxes .each(function() {
           values += $(this).val() + "|";
        });

        $(link_ids).val(values.substring(0, values.length-1));
    });
});

Check out this jsFiddle