折りたたみ可能/拡張可能なテーブルの動作

Question

私は折りたたみ式テーブル・スクリプトを持って

..いくつかのjQuery/JS/JSPの機能を助ける必要があります。

(function($){ 
$.fn.extend({ 
    setupCollapstable: function(options) { 
     var defaults = { 
       displayStyle: "Image", 
       autoCheckbox: true, 
       toggleMinus: "/resource/images/collapse_close.gif", 
       togglePlus: "/resource/images/collapse_open.gif" 
     }; 

     var options = $.extend(defaults, options); 

     var toggleMinus = options.toggleMinus 
     var togglePlus = options.togglePlus 

     return this.each(function() { 

      //Creating a reference to the object 
      var obj = $(this); 

      //Break out the individual tbody elements 
      var rowGroups = $('tbody', obj); 

      //Loop through every tbody to setup collapsable and click events 
      $.each(rowGroups, function(intIndex, objValue){ 

       parentRow = $('th:first-child', objValue); 
       childCount = parentRow.parent().siblings().length; 

       if (childCount != 0) { 
        //console.log ("ParentRow: " + parentRow + " - ChildCount is: " + childCount); 

        parentRow.prepend('<img src="' + togglePlus + '" alt="collapse this section" />'); 

        parentRow.parent().siblings().fadeOut('fast'); 

        $('img', parentRow).addClass('clickable').click(function(e) { 
         e.preventDefault(); 
         var toggleSrc = $(this).attr('src'); 

         if (toggleSrc == toggleMinus) { 
          $(this).attr('src', togglePlus).parents('tr').siblings().fadeOut('fast'); 
         } else{ 
          $(this).attr('src', toggleMinus).parents('tr').siblings().fadeIn('fast'); 
         }; 
        }); 

        var parentCheckbox = $(':checkbox', parentRow.siblings()) 

        var childCheckboxes = $(':checkbox', parentRow.parent().siblings()); 

        parentCheckbox.click(function(e){ 

         var checked_status = parentCheckbox.attr('checked')?1:0; 

         childCheckboxes.each(function(){ 
          this.checked = checked_status;   
         }); 
        }); 

       } else { 
        parentRow.addClass("indented"); 
       } 

      }); 
       //console.dir (objValue); 

     }); 
    } 
}); 
})(jQuery); 

私のJSPから、私はそのように呼んで....

<script type="text/javascript" src="/resource/js/jquery.collapstable.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $('table.collapstable').setupCollapstable(); 
     }); 
    </script> 

用法：

<table class="collapstable NoTableBorder"> 

イメージアイコンをクリックするとテーブルが適切に折りたたまれて展開されますが、（JSP上で）特定のチェックボックスがオンになっていると、最初に展開されます。

だから、私はonclick = "showOrHide（）"機能を使ってテーブルを折りたたんだり展開したりしています。

私はビジュアル表現のために画像を添付しましたが、collpaseテーブルは太字のVISAヘッダーの横にある "+/-"アイコンで、表示用に展開する必要があるかどうかを決定するチェックボックスは "これですべてのヘルプは素晴らしいだろうアクティブ」チェックボックス..

...

Answer 1

あなたは、関数呼び出し

<script type="text/javascript"> 
    $(document).ready(function(){ 
     if (checkboxname.checked){ 
      // Set flags to show the table expanded 
     }else{ 
      // Set flags to show the table collapsed 
     } 
     $('table.collapstable').setupCollapstable(); 
    }); 
</script>