EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: pato.llaguno on September 29, 2015, 02:25:19 PM


Title: (solved)Multiline headers in datagrid
Post by: pato.llaguno on September 29, 2015, 02:25:19 PM
Hello, i have somewhat "long" headers, and i was trying to make them a fixed width so the datagrid looks nicer. the problem is that the headers are loaded dynamically so i cant have them set to a specific width. The header count is dynamic so my goal is to calculate how many headers im having and later on ill divide it into the number of headers. the problem is that for me to be able to do that i need the header to display in , multiline which i can't, ATM i am not having the dynamic headers and having them static and using "br" tags to make it multiline, which won't do the trick for dynamic header since it wont break lines where it has to.

i tried
Code:
.datagrid-header-row .datagrid-cell{
		line-height:normal;
		height:auto;
}

but no success, i dont know if it has something to do that i have a 2 row header.

Header:
Code:
<thead>
     <tr>
            <th field="estatus" rowspan="2" align="center">Estatus</th>
            <th field="Numero" rowspan="2" align="center">Orden</th>
            <th field="FechaRegistro" align="center" rowspan="2" >Fecha</th>
            <th field="T1" align="center">00:02:00</th>
            <th field="T2" align="center">00:24:00</th>
            <th field="T3" align="center">00:04:00</th>
            <th field="T4" align="center">02:00:00</th>
            <th field="Cierre" rowspan="2" align="center">Fecha Cierre</th>
    </tr>
    <tr>
            <th field="P1" align="center" width="80px" styler="formatColor">Informacion tecnica para aprobacion</th>
            <th field="P2" align="center" width="80px" styler="formatColor">Aprobacion de Informacion Tecnica cliente</th>
            <th field="P3" align="center" width="80px" styler="formatColor">Informacion Tecnica de Proceso</th>
            <th field="P4" align="center" width="80px" styler="formatColor">Compra y Recepcion de Materiales</th>
    </tr>            
   </thead>

Any sugestions?

Title: Re: Multiline headers in datagrid
Post by: jarry on September 30, 2015, 12:25:06 AM
If you want a multiline title on the columns, please try this:
Code:
.datagrid-header-row .datagrid-cell{
  line-height:normal;
  height:auto;
  white-space:normal;
}

Title: Re: Multiline headers in datagrid
Post by: pato.llaguno on September 30, 2015, 07:42:42 AM
Thanks! i was missing the whitespace: normal.

now working


Powered by SMF 1.1.18 | SMF © 2013, Simple Machines