Not able to display number when a checkbox is selected again

when i check "children" checkbox ,im able to increment/ decrement the number from the new displayed children "inc/dec" div, but as soon as i uncheck the 'children' checkbox and check it again ,i'm not able to increment/ decrement the number again. here is the fiddle http://jsfiddle.net/N5Sd2/26/ Any help would be great!!!

$( document ).ready(function() {
        var advertNodes = $('#childrens');


  advertNodes.click(function() {
  if (!advertNodes.is(':checked')) {
        $('.hellow').hide();
      $("#children").val(0);
  }
  else {
    $('.hellow').show();
    updatecover(children);
  }
  });
        $('.insureAdult').click(function(){
            var children = $('#children').val();

            if($('input[type="checkbox"]:not("#childrens"):checked').length > 0){

                updatecover(children);
            }else{
                $('#healthCover').val('');
                $('#children').val(0);
            }


        });


        $('.btn-number').click(function(e){
            e.preventDefault();

            if($('input[type="checkbox"]:not("#childrens"):checked').length > 0){


                var fieldName = $(this).attr('data-field');
                var type      = $(this).attr('data-type');
                var input = $("input[name='"+fieldName+"']");
                var currentVal = parseInt(input.val());
                if (!isNaN(currentVal)) {
                    if(type == 'minus') {
                        var minValue = parseInt(input.attr('min')); 
                        if(!minValue) minValue = 0;
                        if(currentVal > minValue) {
                            input.val(currentVal - 1).change();

                            var children = currentVal - 1;
                            updatecover(children);
                        } 
                        if(parseInt(input.val()) == minValue) {
                            $(this).attr('disabled', true);
                        }

                    } else if(type == 'plus') {
                        var maxValue = parseInt(input.attr('max'));
                        if(!maxValue) maxValue = 4;
                        if(currentVal < maxValue) {
                            input.val(currentVal + 1).change();

                            var children = currentVal + 1;
                            updatecover(children);
                        }
                        if(parseInt(input.val()) == maxValue) {
                            $(this).attr('disabled', true);
                        }

                    }
                } else {
                    input.val(0);
                }
            }
        });
        $('.input-number').focusin(function(){
           $(this).data('oldValue', $(this).val());
        });
        $('.input-number').change(function() {

            var minValue =  parseInt($(this).attr('min'));
            var maxValue =  parseInt($(this).attr('max'));
            if(!minValue) minValue = 0;
            if(!maxValue) maxValue = 4;
            var valueCurrent = parseInt($(this).val());

            var name = $(this).attr('name');
            if(valueCurrent >= minValue) {
                $(".btn-number[data-type='minus'][data-field='"+name+"']").removeAttr('disabled')
            } else {
                alert('Sorry, the minimum value was reached');
                $(this).val($(this).data('oldValue'));
            }
            if(valueCurrent <= maxValue) {
                $(".btn-number[data-type='plus'][data-field='"+name+"']").removeAttr('disabled')
            } else {
                alert('Sorry, the maximum value was reached');
                $(this).val($(this).data('oldValue'));
            }

        });

    });

    function updatecover(children){
        var tmpcover = '';
        $('#healthSecondPart').val(0);

        $('input[type="checkbox"]:not("#childrens"):checked').each(function() {
            var member = $(this).val();
            if(tmpcover == ''){
                tmpcover = $.trim(member);
            }else{
                tmpcover = tmpcover+', '+$.trim(member);
            }
        });


        if(children > 1){
            var child = 'Children';
        }else{
            var child = 'Child';
        }

        if(children >= 1){
            tmpcover = tmpcover+', '+children+' '+child;
        }

        $('#healthCover').val(tmpcover);
    }

Answers 1

  • it only happens if you increment to 4 before unchecking and the reason is this:

      if(parseInt(input.val()) == maxValue) {
         $(this).attr('disabled', true);
      }
    

    you need to reset the disabled when this $('#children').val(0); happens


Related Articles