Скрыть столбец в flexigrid

Question

Есть ли способ скрыть и показать столбец в jQuery flexigrid следующим образом?

$('#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" /> 

---

Вы можете также установить скрыть ложь на установке colModel Flexigrid в:

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

---

Вы также можете добавить метод против Flexigrid, вы можете поместить это в отдельной библиотекой JavaScript:

(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

Попробуйте что-то вроде этого

$('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