View Full Version : Preventing first grid row from scrolling

29 Apr 2014, 8:40 AM
I need to lock the first row in my grid to prevent it from scrolling vertically. This is essentially like adding second header however it should look like a row and should contain data from the grid model.

One approach I contemplate is to separate the first row data out in the model and modify the header template to make the second header row look like a regular data row. The disadvantage is that I will have to provide data binding to the second header row to populate it with the numbers I need.

Does anyone have an example of this done (e.g. via a plugin)? Seems like a very common feature (freezing a grid row), and one already done with columns as this post suggests....

P.S. This is very similar to locking columns in this example, except I need it with rows:

29 Apr 2014, 11:04 AM
Yeah, grid (view) does not support row locking. Nevertheless, there is a solution.

I also needed to solve the similar problem for Grid MultiSearch Plugin (http://extjs.eu/software/ext-grid-multisearch-plugin/) to add a row below header that doesn't scroll with other rows.

I've docked another container with hbox layout under the grid header and synchronized number and widths of its items.

Maybe a similar approach would work for you too.

30 Apr 2014, 1:24 PM
That's what I ended up doing, thanks for the tip!I first tried stacking two tables one on top of the other. The first one would have a header and just one row, the second one would have no header and and would display all the remaining rows. That didn't quite work since I couldn't reliably detect when the second table gains a scrollbar (so I could then alight the first table by padding a padding to it).

17 Jun 2016, 3:11 AM
Try https://www.sencha.com/forum/showthread.php?311586-UX.plugin.grid.Split-Plugin-for-splitting-freezing-rows-in-a-grid&p=1137747