How to make a grid's row fills space

asked 2011-05-10 10:03:37 +0800

Neus gravatar image Neus
1415 14

Hi all,
I have a grid like this:

<div height="500px">
      <grid vflex="1">
				<label id="LBLResumenTarea" value="Resumen" />
				<textbox id="TBResumenTarea" width="99%" sclass="Obligatorio"/>
			<row vflex="1">
				<label id="LBLDescTarea" value="Desc" />
				<textbox id="TBDescTarea" width="98.6%" multiline="true" height="100%"/>
			<row spans="2">
					<listbox id="LBDocumentos" width="99.5%" rows="3">
							<listheader id="LHNombre" width="250px" label="" />
							<listheader id="LHDescripcion" label="" />
							<listheader id="LHVerDoc" width="35px"/>
					<div width="99.5%" height="25px" sclass="BotoneraListBox" style="margin-bottom:5px">
						<toolbarbutton id="TBTAñadirDoc" label="_Añadir" tooltiptext="_Añadir nuevo documentos"/>
						<toolbarbutton id="TBTEliminarDoc" label="_Eliminar" tooltiptext="_Eliminar documento seleccionado" style="margin-left:10px" disabled="true"/>

The Grid is 100% but it doesn't fill the space. I want the second row to fills all available space. How can I do that?

Thank you

delete flag offensive retag edit

3 Replies

Sort by » oldest newest

answered 2011-05-10 23:15:48 +0800

jumperchen gravatar image jumperchen
3909 2 8
http://jumperchen.blogspo... ZK Team

No such feature yet, please post it to ZK feature request.

link publish delete flag offensive edit

answered 2012-12-22 02:52:39 +0800

aktejo gravatar image aktejo
155 3

it has been more than 1 year, it seems that this feature not supported yet.

I think this is very important to help in creating tidy layout using grid.

link publish delete flag offensive edit

answered 2012-12-22 20:20:13 +0800

rdgrimes gravatar image rdgrimes
735 7

updated 2012-12-22 23:40:31 +0800

Here's a work around. In the given example, the div and grid height are 500px. You can make the second row, with the Desc textbox use up the rest of the area by setting the textbox to either 'height="300px"' or 'rows="25"'. It's not ideal, but if you're going to have a fixed grid height, it's not an unreasonable solution. I'm assuming that what you really want is not just the 2nd row to take up the balance of space, but the textbox to equally expand to fill its parent.

Even if the ZK team alters the grid to accommodate what you're asking, it isn't going to change the behaviour of the textbox inside. In other words, textbox will not reshape itself to fit the parent because it is designed to shape its height based on its content, if absent a fixed height measurement or fixed number of rows. If we think about it, how could the textbox component accommodate such an expectation? It would have to ignore its fluid height charateristics, when absent a fixed height or number of rows, but only if its parent has vflex="1".

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools




Asked: 2011-05-10 10:03:37 +0800

Seen: 343 times

Last updated: Dec 22 '12

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More