フレキシグリッドの列を非表示にする

Question

jQueryのフレキシグリッドで列を非表示にする方法はありますか？

$('#FlexigridID').hideCol('ColumnName'); 
$('#FlexigridID').showCol('ColumnName'); 

Answer 1

テスト

新コード：

$(function() { 


    var visible = true; 
    $('#yo').click(function() { 
     alert('hello'); 

     visible = !visible; 
     showColumn('#yourFlexigridNameHere', 'Lastname', visible); 
    }); 

}); 


// you can put this in a separate javascript library 
function showColumn(tbl, columnName, visible) { 

    var grd = $(tbl).closest('.flexigrid'); 
    var colHeader = $('th[abbr=' + columnName + ']', grd); 
    var colIndex = $(colHeader).attr('axis').replace(/col/, ""); 


    // queryVisible = $(colHeader).is(':visible'); 
    // alert(queryVisible); 

    $(colHeader).toggle(visible); 

    $('tbody tr', grd).each(
     function() { 
      $('td:eq(' + colIndex + ')', this).toggle(visible); 
     } 
    ); 

} 

HTML：

<input id='yo' type="button" /> 

---

することができますあなたはまた、flexigridに対してメソッドを追加することができ、あなたは別のJavaScriptライブラリでこれを置くことができる

colModel: [ 
    {display: 'Row ID', name : 'Lastname', width : 100, 
    sortable : true, align: 'left', hide: false} 

---

：またflexigridのcolModelセットアップにfalseに非表示を設定し

(function ($) { 

    $.fn.showColumn = function (columnName, visible) {   

     if (visible == undefined) visible = true; 

     var grd = this.closest('.flexigrid');   
     var colHeader = $('th[abbr=' + columnName + ']', grd); 
     var colIndex = $(colHeader).attr('axis').replace(/col/, ""); 

     $(colHeader).toggle(visible); 

     $('tbody tr', grd).each(
      function() {     
       $('td:eq(' + colIndex + ')', this).toggle(visible); 
      } 
     ); 
    }; 

    $.fn.hideColumn = function (columnName) { 
     this.showColumn(columnName, false); 
    } 

})(jQuery); 

あなたができるようになりました隠ぺいを起動し、これらを使用して示す：

$('#FlexigridID').hideColumn('ColumnName'); 
$('#FlexigridID').showColumn('ColumnName'); 


visible = !visible; // for toggling need 
$('#FlexigridID').showColumn('ColumnName', visible); 

Answer 2

これを試してみてください：

$('#FlexigridID').find("tr td").eq(columnIndex).hide(); 
$('#FlexigridID').find("tr td").eq(columnIndex).show(); 

Answer 3

この

012のようなものを試してみてくださいヘッダとテーブルの

$('td:nth-child(2)').hide(); 

（目）

$('td:nth-child(2),th:nth-child(2)').hide(); 

がHide a Table Column with a Single line of jQuery code