Forum

November 2nd, 2014
A A A
Avatar

Lost password?
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

The forums are currently locked and only available for read only access
sp_Feed Topic RSS sp_TopicIcon
How to achieve fluid jqGrid height
05/04/2012
08:11
Avatar
Vincent Ghomus
UK
Member
Members
Forum Posts: 6
Member Since:
04/04/2012
sp_UserOfflineSmall Offline

Hi,

    I need to achieve fluid property in height for jqGrid. As far as i searched, I could see  fluid property only in width. I'm using "jquery.jqGrid.fluid.js" for achieving fluid property in width. When we use a high resolution monitor the grid may occupy only small potion of it. So how to expand the grid height and pagination also need to be changed according resolution changes. For me the grid height only expands, but pagination not happening. I've uploaded my grid's snap in the following link:  2shared.com/photo/6l2Objaq/jqGrid.html . Please help me.

Thanks

22/04/2012
22:27
Avatar
kobruleht
Member
Members
Forum Posts: 144
Member Since:
05/05/2011
sp_UserOfflineSmall Offline

Use this method:

        $(window).resize(function () { resizeGrid() });

<script>

function resizeGrid() {
  setTimeout( function() {
    var toppager_height=$("#grid_toppager").outerHeight(true),
        header_height=$("div#gview_"+$grid[0].id+" > div.ui-jqgrid-hdiv").outerHeight(true);
   var height = $(window).height()-$('#grid1container')[0].offsetTop-toppager_height-header_height-2;

   $grid.jqGrid("setGridWidth", $('#grid1container').width() , false);
   if (height>60)
     $grid.jqGrid('setGridHeight', height );
  }, 100 );
  }

    </script>

    <div id="grid1container" style="width: 100%">
        <table id="grid">
        </table>
    </div>

08/08/2014
17:13
Avatar
pphillips001
Member
Members
Forum Posts: 4
Member Since:
22/10/2013
sp_UserOfflineSmall Offline

I know this question is old, but the reply is a clunky and slow.

Here's a CSS approach:

http://jsfiddle.net/Ba5yK/11/

Add this to the grid definition (change the name of gridName to that of your grid)

beforeRequest: function () {
  setTimeout(function () {
    var gridName = 'grid';
    $('#gbox_' + gridName).css({
      position: 'absolute',
      top: 0,
      bottom: $('#gbox_' + gridName + ' .ui-pager-control').outerHeight() + 'px',
      width: '100%',
      height: '100%'
    });
    $('#gbox_' + gridName + ' .ui-jqgrid-view').css({ 'height': '100%' });

    $('#gbox_' + gridName + ' .ui-jqgrid-bdiv').css({
      position: 'absolute',
      top: $('#gbox_' + gridName + ' .ui-jqgrid-titlebar').outerHeight() + $('#gbox_' + gridName + ' .ui-jqgrid-hbox').outerHeight() + 'px',
      bottom: 0,
      left: 0,
      right: 0,
      height: '',
      width: ''
    });

  }, 100);
}

11/08/2014
15:17
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Hello,

 

Thanks for the code and the idea , but there is a problem when we try to sort.

 

Kind Regards

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

21/08/2014
10:55
Avatar
pphillips001
Member
Members
Forum Posts: 4
Member Since:
22/10/2013
sp_UserOfflineSmall Offline

Glad to help

The problem you mention is the 'Loading' sign not going away - that was just to do with the missing grid.locale-en.js.

*Edit - just spotted I had the wrong sort type on the 'thingy' column.

It wasn't related to the resizing.  Here's a new link:

http://jsfiddle.net/Ba5yK/16/

I'm using this CSS injection on dozens of grids and all work perfectly.

Regards

 

Paul

21/08/2014
17:20
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Hello,

Thanks. It works ok now.

 

Kind Regards

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

Forum Timezone: Europe/Sofia

Most Users Ever Online: 496

Currently Online:
38 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information