开发者

Jquery chechboxTree and Cookie plugin - Problem with getting children

I'm using the checkboxTree plugin in relation with the cookie plugin for jquery. My problem is, I'd like to set/unset all cookies of the children (from header) when a checkbox with class "header" was clicked. How can I do that? Here's my .js code:

 // When page has loaded, check each checkbox if it's checked (set cookie) or not (unset cookie)
 $(".tree input:checkbox").each(function(){
  var elementId = this.id;

  // Check if a cookie of the element exists
  if($.cookie(elementId)){
   // If so, change attribute to checke开发者_StackOverflow中文版d
   $(this).attr("checked", "checked");
  }else{
   // If not, change attribute to not checked
   $(this).attr("checked", "");
  }

 });

 $(".tree input:checkbox").change(function(){
  if($(this).attr("class") == "header"){
   if($(this).is(":checked")){
    setCookie(this.id);
    // Set cookie for all children
   }else{
    unsetCookie(this.id);
    // Unset cookie for all children
   }
  }else{
   if($(this).is(":checked")){
    setCookie(this.id);
   }else{
    unsetCookie(this.id);
   }
  }
 });

 function setCookie(element){
  $.cookie(element, "checked");
 }

 function unsetCookie(element){
  $.cookie(element, null);
 }


    $('.tree').checkboxTree({
     onCheck: { 
         node: 'expand' 
        }, 
        onUncheck: { 
            node: 'collapse' 
        }, 
     collapseImage: '../media/images/icons/minus.png',
        expandImage: '../media/images/icons/plus.png'
    });

And here my html code:

   <div id="filterTree">
     <ul class="tree">
         <li><input type="checkbox" id="Human Ressources" class="header">Human Resources
             <ul>
                 <li><input type="checkbox" id="Finance">Finance
                 <li><input type="checkbox" id="Personnel">Personnel
                 <li><input type="checkbox" id="Post Office">Post Office
                 <li><input type="checkbox" id="House Service">House Service
                 <li><input type="checkbox" id="Reception">Reception
                </ul>
         </ul>
    </div>


  if($(this).attr("class") == "header"){
    //selects all input of the type checkbox that are within the ul li elements, each loops trough the list of those elements
    $(this).parents("ul.tree").find("ul li input:checkbox").each(function() {
      if($(this).is(":checked")){  //if this item of the list is checked set a cookie, otherwise unset it.
        setCookie(this.id);
      }
      else {
        unsetCookie(this.id);
      }
    });
  }

And remove the "," on the end of

expandImage: '../media/images/icons/plus.png',
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜