jqGrid obtener "th" y "thead" usando jQuery

Question

¿Cómo puedo obtener theader en un jqGrid usando jQuery?

Answer 1

Si existe un thead y th en el DOM, se puede seleccionar. ¿Tienes un ejemplo de lo que estás tratando de hacer?

Answer 2

Probar:

jQuery("thead", "#mygrid") 

Answer 3

Mi respuesta corta es: en lugar de seleccionar los elementos DOM que corresponde <th> elementos que usted está buscando se debe utilizar

$("#list")[0].grid.headers 

Devuelve la matriz de esta Elementos DOM, corresponde al <th>. La descripción larga de mi respuesta sigue.

Entiendo el motivo de su pregunta. Si ha definido, por ejemplo, la parte de base jqGrid como

<table id="list"></table> 
<div id="pager"></div> 

continuación $("#list") le da <table> sólo con los "datos" parte de la red sin cabeceras. La parte principal de "datos" de la tabla se colocará dentro de algunos divs. Otros elementos de jqGrid se colocarán en los divs como tablas. La estructura de jqGrid (no completo) voluntad parece siguiente:

div.ui-jqgrid#gbox_list 
    div.ui-jqgrid-view#gview_list 
    div.ui-jqgrid-titlebar    - caption 
    div.ui-userdata#t_list    - optional top toolbar 
    div.ui-jqgrid-toppager#list_toppager - optional top pager 
    div.ui-jqgrid-hdiv     - all grid headers 
     div.ui-jqgrid-hbox    - (div.ui-jqgrid-hbox-rtl) if direction:"rtl" 
     table.ui-jqgrid-htable 
      thead 
      tr.ui-jqgrid-labels   - row with column headers (labels) 
       th#list_rn    - optional column header with row numbers 
       th#list_Col1    - column header for the column name:"Col1" 
       ... 
       th#list_level    - optional column header for some other 
              special columns in case of usage TreeGrid 
              the hidden columns of TreeGrid are: level, 
              parent, isLeaf, expanded, loaded, icon 
      tr.ui-search-toolbar  - row for toolbar searching 
       th 
       th 
       ... 
    div.frozen-div.ui-jqgrid-hdiv  - optional frozen headers 
     table.ui-jqgrid-htable   - table with frozen columns headers only 
      ... 
    div.ui-jqgrid-bdiv     - div with the main grid data 
     div 
     table#list      - table with the main grid data 
    div.frozen-bdiv.ui-jqgrid-bdiv  - optional div with the main grid data 
     div 
     table#list_frozen    - table with the main grid data 
    div.ui-userdata#tb_list    - optional bottom toolbar 
    div.ui-jqgrid-resize-mark#rs_mlist 
    div.ui-jqgrid-pager#pager    - the div with the pager 

(aquí en la mesa Solía ​​rownumbers: true, por lo que hay th#list_rn, la primera columna tiene el nombre 'Col1', por lo que hay th#list_Col1 y así en)

se puede ver, que la cabecera de la tabla table.ui-jqgrid-htable lata tiene dos hijos: uno <tr> subelementos tr.ui-jqgrid-labels para los encabezados de columna y uno tr.ui-search-toolbar para la filterToolbar.

Mi sugerencia para usted no es utilizar esta jerarquía relativamente compleja, sino usar otra forma oculta oculta en jqGrid. El código

var gridDom = $("#list")[0]; 

obtenemos el elemento DOM del elemento de la tabla. Este elemento tiene una extensión importante que está hecha por jqGrid. Estos son gridDom.p que contienen todos los parámetros de jqGrid. Otra extensión importante es gridDom.grid con propiedades importantes bDiv, cDiv, hDiv, fbDiv, fhDiv, uDiv y también cols, footers, topDiv y headers. Le sugiero que use la matriz gridDom.grid.headers como la mejor manera de recibir una lista de <th> elementos de los encabezados de las columnas de la grilla (de la fila correcta <tr>).