Checkbox not working properly

Question

Here is my piece of code in jquery actuall I want in such way where :

• Where by default value of Ball will be shown in Textbox.
• same time either All or Stopall will be work(it's not working here properly :( )
• For multiple times checking All button,which is not working according to the expectation

here is the fiddle link : http://jsfiddle.net/bigzer0/PKRVR/11/

$(document).ready(function() {
    $('.check').click(function(){
        $("#policyName").val('Start');
        $("#features").val('');

        $('[name="startall"]').on('click', function() {
        var $checkboxes = $('input[type="checkbox"]').not('[name="startall"], [name="stopall"]');
        if (this.checked) {
            $checkboxes.prop({
                checked: true,
                disabled: true
            });
        }
        else{
             $checkboxes.prop({
                checked: false
            });
        }
    });

                  $(".check").each(function(){
            if($(this).prop('checked')){

                $("#policyName").val($("#policyName").val() + $(this).val());    
                $("#features").val($("#features").val() + $(this).data('name'));
                }            
        });

     });
});

Any comments on this context will be welcome

Answer 1

You're code is broken in many ways. You are binding a click event inside a click event. You should take that outside and just make sure it's inside the document.ready function since your element is a static element.

$(document).ready(function() {    
    // cache features
    var $features = $('#features');
    // cache policyname
    var $policy = $("#policyName");
    // cache all/stopall
    var $ss = $('[name="startall"],[name="stopall"]');
    // cache all others
    var $checkboxes = $('input[type="checkbox"]').not($ss);

    // function to update text boxes
    function updateText() {
        var policyName = 'Start';
        var features = '';
        // LOOP THROUGH CHECKED INPUTS - Only if 1 or more of the 3 are checked
        $checkboxes.filter(':checked').each(function(i, v) {
            policyName += $(v).val();
            features += $(v).data('name');
        });
        // update textboxes
        $policy.val(policyName);
        $features.val(features);
    }

    $checkboxes.on('change', function() {
        updateText();
        // check startall if all three boxes are checked
        $('input[name="startall"]').prop('checked', $checkboxes.filter(':checked').length == 3);
    });

    $('input[name="startall"]').on('change', function() {
        $checkboxes.prop({
            'checked': this.checked,
            'disabled': false
        });
        updateText();
    });

    $('input[name="stopall"]').on('change', function() {
        $checkboxes.add('[name="startall"]').prop({
            'checked': false,
            'disabled': this.checked
        });
        updateText();
    });

    // updatetext on page load
    updateText();
});​

FIDDLE

Answer 2

you are checking click function in click function. you should use if statement.