2

I am using jquery multiselect in my project,when user clicks on checkall then how can i stop this function to check last option in jquery multiselect?

like if i have 4 option in my jquery multiselect and if user clicks on check all i want intial three option to be checked but last option is unchecked. any help would be much appreciated

2
  • Should they ever be able to check the last option? Mar 21, 2012 at 7:52
  • yeah they need to check manually..i mean apart from checkall
    – Gautam
    Mar 21, 2012 at 8:02

2 Answers 2

2

Here you go updated solution here for plugin as well normal multiple checkbox with demo!

Solution for multiselect Checkbox special condition to uncheck last checkbox on checkall

Working MultiSelect jsfiddle for specific case regarding @Gautam's multiselect plugin: http://jsfiddle.net/fG6PT/82/

HTML:

<select multiple="multiple" class='multi'>
<option value="foo">foo</option>
<option value="bar">bar</option>
<option value="baz">baz</option>
<option value="toy">toy</option>
</select>

JQuery

$('.multi').multiselect({

    // Uncheck the last checkbox when chaeckall happens.
    checkAll: function () {

       if ($(this).is(":last") == true){

          var arr = $(this).val().toString().split(',');
           // Work on the array length alert('===>' + arr.length);
           var l = arr.length;
           for(i=(l-1);i<l;i++){
               // so whatever the lenght is aim for the last element
                 $('input:checkbox[value="' + arr[i] + '"]').attr('checked', false);
           }
        }
    }

});

Solution below is for normal Chckbox

Working example here: http://jsfiddle.net/Ev7FX/5/

http://jsfiddle.net/Ev7FX/4/

Html

<input type="checkbox" name="check[]" value="1" />
<input type="checkbox" name="check[]" value="2" />
<input type="checkbox" name="check[]" value="3" />
<input type="checkbox" name="check[]" value="4" />
<a href="#" title="" id="check">check all</a> <a href="#" title="" id="uncheck">uncheck all</a>​

JQuery Code

var all_checkboxes = jQuery(':checkbox');

jQuery('#check').on('click', function(event){
    event.preventDefault();
       all_checkboxes.not(':last').prop('checked', true);
});

jQuery('#uncheck').on('click', function(event){
    event.preventDefault();
    all_checkboxes.prop('checked', false);
});​

This will help, cheers!

12
  • Thanks for reply your solution is working fine with normal multiselect...but iam facing issues with jquery Multiselect
    – Gautam
    Mar 21, 2012 at 8:09
  • Hiya Jquery multiselect? umm, how do you mean? DO you mean something like this: jsfiddle.net/ZUYRj/1 another working solution for you which does not select last checkbox , Hope this helps, cheers
    – Tats_innit
    Mar 21, 2012 at 8:10
  • Please check this link erichynds.com/examples/jquery-ui-multiselect-widget/demos
    – Gautam
    Mar 21, 2012 at 8:13
  • 1
    @Gautam take a look into the link you gave me - it must have an option property to set that to 3 , [Link] erichynds.com/jquery/jquery-ui-multiselect-widget hope this helps for that slected option display.
    – Tats_innit
    Mar 21, 2012 at 10:05
  • 1
    Try now, now you got 15 + (magic :) so you can up vote now; and by the way i can hepk you with your other questions, its time for me to sleep (in 20 mins) but you have +1 rights now! cheers
    – Tats_innit
    Mar 21, 2012 at 10:58
0

Capture the checkboxes, iterate through them, perform(or in your case, don't perform) a unique action for the last element found.

var ourCheckBoxes = $(":checkBoxes");
$.each(ourCheckBoxes, function(index,value){
  if(index = ourCheckBoxes.length -1){
    //this is our last element broski
  }
});
3
  • Hiya, sup man or can do like this as below [code] .not(':last').prop('checked', true); [code] , what do you reckon, cheers ;
    – Tats_innit
    Mar 21, 2012 at 8:02
  • They're the same, essentially. He's just hijacking the click function of the 'check all' element, and telling it apply a checkbox to all elements that are not last. I'm simply running a test against all checkboxes and provided a place where you can run (or not run) code. In your case, you'll want to do nothing inside of the if statement, and use else{ $(this).prop('checked', true); }
    – Ohgodwhy
    Mar 21, 2012 at 8:06
  • Yep, great to talk to you man, wonder about the this hacky requirement hence discussed, Have a good one!
    – Tats_innit
    Mar 21, 2012 at 8:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.