corrade-nucleus-nucleons – Blame information for rev 20
?pathlinks?
Rev | Author | Line No. | Line |
---|---|---|---|
20 | office | 1 | # Column options []({{ site.repo }}/blob/develop/docs/_i18n/{{ site.lang }}/documentation/column-options.md) |
2 | |||
3 | --- |
||
4 | |||
5 | Las propiedades de la columna están definidas en `jQuery.fn.bootstrapTable.columnDefaults`. |
||
6 | |||
7 | <table class="table" |
||
8 | id="c" |
||
9 | data-search="true" |
||
10 | data-show-toggle="true" |
||
11 | data-show-columns="true" |
||
12 | data-mobile-responsive="true"> |
||
13 | <thead> |
||
14 | <tr> |
||
15 | <th>Nombre</th> |
||
16 | <th>Atributo</th> |
||
17 | <th>Tipo</th> |
||
18 | <th>Valor por defecto</th> |
||
19 | <th>Descripción</th> |
||
20 | </tr> |
||
21 | </thead> |
||
22 | <tbody> |
||
23 | <tr> |
||
24 | <td>radio</td> |
||
25 | <td>data-radio</td> |
||
26 | <td>Boolean</td> |
||
27 | <td>false</td> |
||
28 | <td>True para mostrar un radio. La columna con el radio tiene fijado el ancho.</td> |
||
29 | </tr> |
||
30 | <tr> |
||
31 | <td>checkbox</td> |
||
32 | <td>data-checkbox</td> |
||
33 | <td>Boolean</td> |
||
34 | <td>false</td> |
||
35 | <td>True para mostrar un checkbox. La columna con el checkbox tiene fijado el ancho.</td> |
||
36 | </tr> |
||
37 | <tr> |
||
38 | <td>field</td> |
||
39 | <td>data-field</td> |
||
40 | <td>String</td> |
||
41 | <td>undefined</td> |
||
42 | <td>El nombre del campo.</td> |
||
43 | </tr> |
||
44 | <tr> |
||
45 | <td>title</td> |
||
46 | <td>data-title</td> |
||
47 | <td>String</td> |
||
48 | <td>undefined</td> |
||
49 | <td>El título de la columna.</td> |
||
50 | </tr> |
||
51 | <tr> |
||
52 | <td>titleTooltip</td> |
||
53 | <td>data-title-tooltip</td> |
||
54 | <td>String</td> |
||
55 | <td>undefined</td> |
||
56 | <td>Texto del title tooltip de la columna. Esta opción soporta el tag title de HTML.</td> |
||
57 | </tr> |
||
58 | <tr> |
||
59 | <td>class</td> |
||
60 | <td>class / data-class</td> |
||
61 | <td>String</td> |
||
62 | <td>undefined</td> |
||
63 | <td>La clase CSS de la columna.</td> |
||
64 | </tr> |
||
65 | <tr> |
||
66 | <td>rowspan</td> |
||
67 | <td>rowspan / data-rowspan</td> |
||
68 | <td>Number</td> |
||
69 | <td>undefined</td> |
||
70 | <td>Indica cuantas filas debe tomar una celda.</td> |
||
71 | </tr> |
||
72 | <tr> |
||
73 | <td>colspan</td> |
||
74 | <td>colspan / data-colspan</td> |
||
75 | <td>Number</td> |
||
76 | <td>undefined</td> |
||
77 | <td>indica cuantas columnas debe tomar una celda.</td> |
||
78 | </tr> |
||
79 | <tr> |
||
80 | <td>align</td> |
||
81 | <td>data-align</td> |
||
82 | <td>String</td> |
||
83 | <td>undefined</td> |
||
84 | <td>Indica cómo se alinea la columna. Se puede usar 'left', 'right', 'center'.</td> |
||
85 | </tr> |
||
86 | <tr> |
||
87 | <td>halign</td> |
||
88 | <td>data-halign</td> |
||
89 | <td>String</td> |
||
90 | <td>undefined</td> |
||
91 | <td>Indica cómo se alinea el encabezado de la tabla. Se puede usar 'left', 'right', 'center'.</td> |
||
92 | </tr> |
||
93 | <tr> |
||
94 | <td>falign</td> |
||
95 | <td>data-falign</td> |
||
96 | <td>String</td> |
||
97 | <td>undefined</td> |
||
98 | <td>Indica cómo se alinea el footer. Se puede usar 'left', 'right', 'center'.</td> |
||
99 | </tr> |
||
100 | <tr> |
||
101 | <td>valign</td> |
||
102 | <td>data-valign</td> |
||
103 | <td>String</td> |
||
104 | <td>undefined</td> |
||
105 | <td>Indica cómo se alinea el contenido de la celda. Se puede usar 'top', 'middle', 'bottom'.</td> |
||
106 | </tr> |
||
107 | <tr> |
||
108 | <td>width</td> |
||
109 | <td>data-width</td> |
||
110 | <td>Number {Pixeles o Porcentaje}</td> |
||
111 | <td>undefined</td> |
||
112 | <td>Indica el ancho de la columna. Si no es definido, el ancho será auto. Tmabién puede agregar '%' a su número y la bootstrapTable |
||
113 | usará la unidad de porcentaje, sino, puede agregar o no 'px' a su número para que bootstrapTable use pixeles.</td> |
||
114 | </tr> |
||
115 | <tr> |
||
116 | <td>sortable</td> |
||
117 | <td>data-sortable</td> |
||
118 | <td>Boolean</td> |
||
119 | <td>false</td> |
||
120 | <td>True para permitir que la coluna sea ordenable.</td> |
||
121 | </tr> |
||
122 | <tr> |
||
123 | <td>order</td> |
||
124 | <td>data-order</td> |
||
125 | <td>String</td> |
||
126 | <td>'asc'</td> |
||
127 | <td>El valor por defecto para ordenar los datos, solo puede ser 'asc' o 'desc'.</td> |
||
128 | </tr> |
||
129 | <tr> |
||
130 | <td>visible</td> |
||
131 | <td>data-visible</td> |
||
132 | <td>Boolean</td> |
||
133 | <td>true</td> |
||
134 | <td>False para ocultar el item de la columna.</td> |
||
135 | </tr> |
||
136 | <tr> |
||
137 | <td>cardVisible</td> |
||
138 | <td>data-card-visible</td> |
||
139 | <td>Boolean</td> |
||
140 | <td>true</td> |
||
141 | <td>False para ocultar columnas en el modo card.</td> |
||
142 | </tr> |
||
143 | <tr> |
||
144 | <td>switchable</td> |
||
145 | <td>data-switchable</td> |
||
146 | <td>Boolean</td> |
||
147 | <td>true</td> |
||
148 | <td>False para deshabilitar el switchable en el item de la columna.</td> |
||
149 | </tr> |
||
150 | <tr> |
||
151 | <td>clickToSelect</td> |
||
152 | <td>data-click-to-select</td> |
||
153 | <td>Boolean</td> |
||
154 | <td>true</td> |
||
155 | <td>True para seleccionar un checkbox o radiobox cuando se le da click a la columna.</td> |
||
156 | </tr> |
||
157 | <tr> |
||
158 | <td>formatter</td> |
||
159 | <td>data-formatter</td> |
||
160 | <td>Function</td> |
||
161 | <td>undefined</td> |
||
162 | <td> |
||
163 | El contexto (this) es el objecto columna. <br> |
||
164 | La función de formateo de la celda, toma tres parámetros: <br> |
||
165 | value: el valor del campo. <br> |
||
166 | row: los datos de la fila.<br> |
||
167 | index: el indice de la fila.</td> |
||
168 | </tr> |
||
169 | <tr> |
||
170 | <td>footerFormatter</td> |
||
171 | <td>data-footer-formatter</td> |
||
172 | <td>Function</td> |
||
173 | <td>undefined</td> |
||
174 | <td> |
||
175 | El contexto (this) es el objecto columna. <br> |
||
176 | La función toma un parámetro: <br> |
||
177 | data: Array de todas las filas. <br> |
||
178 | La función debe retornar un string con el texto a mostrar en el footer. |
||
179 | </tr> |
||
180 | <tr> |
||
181 | <td>events</td> |
||
182 | <td>data-events</td> |
||
183 | <td>Object</td> |
||
184 | <td>undefined</td> |
||
185 | <td> |
||
186 | Los eventos de la celda son escuchados cuando se usa la función formatter, toma tres parámetros: <br> |
||
187 | event: el evento de jQuery. <br> |
||
188 | value: el valor del campo. <br> |
||
189 | row: los datos de la fila.<br> |
||
190 | index: el indice de la fila.</td> |
||
191 | </tr> |
||
192 | <tr> |
||
193 | <td>sorter</td> |
||
194 | <td>data-sorter</td> |
||
195 | <td>Function</td> |
||
196 | <td>undefined</td> |
||
197 | <td> |
||
198 | La función sort es usada para hacer el ordenamiendo customizable, toma dos parámetros: <br> |
||
199 | a: el primer valor del campo.<br> |
||
200 | b: el segundo valor del campo.</td> |
||
201 | </tr> |
||
202 | <tr> |
||
203 | <td>sortName</td> |
||
204 | <td>data-sort-name</td> |
||
205 | <td>String</td> |
||
206 | <td>undefined</td> |
||
207 | <td>Proporcionar una especie-nombre adaptable, no la clase-nombre por defecto en la cabecera, o el nombre del campo |
||
208 | de la columna. Por ejemplo, una columna puede mostrar el valor de nombreCampo de "HTML" como |
||
209 | "<b><span style="color:red">abc</span></b>", pero una nombreCampo para ordenar es el "contenido" con el valor de "abc". |
||
210 | </td> |
||
211 | </tr> |
||
212 | <tr> |
||
213 | <td>cellStyle</td> |
||
214 | <td>data-cell-style</td> |
||
215 | <td>Function</td> |
||
216 | <td>undefined</td> |
||
217 | <td> |
||
218 | La función formatter para el estilo de la celda, toma tres parámetros: <br> |
||
219 | value: el valor del campo.<br> |
||
220 | row: los datos de la fila.<br> |
||
221 | index: el indice de la fila.<br> |
||
222 | field: la vico kampo.<br> |
||
223 | Soporta clases o CSS. |
||
224 | </td> |
||
225 | </tr> |
||
226 | <tr> |
||
227 | <td>searchable</td> |
||
228 | <td>data-searchable</td> |
||
229 | <td>Boolean</td> |
||
230 | <td>true</td> |
||
231 | <td>True para incluir la columna en la búsqueda.</td> |
||
232 | </tr> |
||
233 | <tr> |
||
234 | <td>searchFormatter</td> |
||
235 | <td>data-search-formatter</td> |
||
236 | <td>Boolean</td> |
||
237 | <td>true</td> |
||
238 | <td> |
||
239 | True to search use formated data. |
||
240 | </td> |
||
241 | </tr> |
||
242 | </tbody> |
||
243 | </table> |