jQuery Grid Plugin - jqGrid - Topic: table row display none style width http://www.trirand.com/blog/?page_id=393/bugs/table-row-display-none-style-width Simple:Press Version 5.7.5.3 unknown on table row display none style width http://www.trirand.com/blog/?page_id=393/bugs/table-row-display-none-style-width#p16359 Bugs http://www.trirand.com/blog/?page_id=393/bugs/table-row-display-none-style-width#p16359 Ahoy Tony,

thanks for your explanation. That gave me more comprehension into the internal structure. I think there is no other solution because you need a fix point to calculate the styles. But this is only a guess – I don't take a look into your JavaScript framework.

In my case I didn't have performance problems because I only accept a max value of 90 rows.  So my solution is the following:

subGridBeforeExpand:

                var theTable = document.getElementById('grid_articles');
                for( var z = 0; z < theTable.tBodies.length; z++ ) {
                  var width0 = '';
                  var width1 = '';
                  var width2 = '';
                  var width3 = '';
                  var width4 = '';
                  var width5 = '';
                  var width6 = '';
                  var width7 = '';
                  var width8 = '';
                  var width9 = '';
                  var width10 = '';
                  var width11 = '';
                  var width12 = '';
                  var width13 = '';
                  var width14 = '';
                  
                  for( var x = 0; x < theTable.tBodies[z].rows.length; x++ ) {
                    if (theTable.tBodies[z].rows[x].cells[2].innerHTML != rowid && x != 0) {
                      if (theTable.tBodies[z].rows[x].style.display == 'none') {
                        theTable.tBodies[z].rows[x].style.display = 'table-row';
                      }
                      else {
                        theTable.tBodies[z].rows[x].style.display = 'none';
                      }
                    }
                    else if (theTable.tBodies[z].rows[x].cells[2].innerHTML != rowid && x == 0) {
                        width0 = theTable.tBodies[z].rows[x].cells[0].style.width;
                        width1 = theTable.tBodies[z].rows[x].cells[1].style.width;
                        width2 = theTable.tBodies[z].rows[x].cells[2].style.width;
                        width3 = theTable.tBodies[z].rows[x].cells[3].style.width;
                        width4 = theTable.tBodies[z].rows[x].cells[4].style.width;
                        width5 = theTable.tBodies[z].rows[x].cells[5].style.width;
                        width6 = theTable.tBodies[z].rows[x].cells[6].style.width;
                        width7 = theTable.tBodies[z].rows[x].cells[7].style.width;
                        width8 = theTable.tBodies[z].rows[x].cells[8].style.width;
                        width9 = theTable.tBodies[z].rows[x].cells[9].style.width;
                        width10 = theTable.tBodies[z].rows[x].cells[10].style.width;
                        width11 = theTable.tBodies[z].rows[x].cells[11].style.width;
                        width12 = theTable.tBodies[z].rows[x].cells[12].style.width;
                        width13 = theTable.tBodies[z].rows[x].cells[13].style.width;
                        width14 = theTable.tBodies[z].rows[x].cells[14].style.width;
                        
                        theTable.tBodies[z].rows[x].style.display = 'none';
                    }
                    else {
                        theTable.tBodies[z].rows[x].cells[0].style.width = width0;
                        theTable.tBodies[z].rows[x].cells[1].style.width = width1;
                        theTable.tBodies[z].rows[x].cells[2].style.width = width2;
                        theTable.tBodies[z].rows[x].cells[3].style.width = width3;
                        theTable.tBodies[z].rows[x].cells[4].style.width = width4;
                        theTable.tBodies[z].rows[x].cells[5].style.width = width5;               
                        theTable.tBodies[z].rows[x].cells[6].style.width = width6;
                        theTable.tBodies[z].rows[x].cells[7].style.width = width7;
                        theTable.tBodies[z].rows[x].cells[8].style.width = width8;
                        theTable.tBodies[z].rows[x].cells[9].style.width = width9;
                        theTable.tBodies[z].rows[x].cells[10].style.width = width10;
                        theTable.tBodies[z].rows[x].cells[11].style.width = width11;
                        theTable.tBodies[z].rows[x].cells[12].style.width = width12;
                        theTable.tBodies[z].rows[x].cells[13].style.width = width13;
                        theTable.tBodies[z].rows[x].cells[14].style.width = width14;

                    }
                  }
                }

subGridRowColapsed:

                var theTable = document.getElementById('grid_articles');
                for( var z = 0; z < theTable.tBodies.length; z++ ) {
                  for( var x = 0; x < theTable.tBodies[z].rows.length; x++ ) {
                    if (theTable.tBodies[z].rows[x].cells[2].innerHTML != rowid) {
                      if (theTable.tBodies[z].rows[x].style.display == 'none') {
                        theTable.tBodies[z].rows[x].style.display = 'table-row';
                      }
                      else {
                        theTable.tBodies[z].rows[x].style.display = 'none';
                      }
                    }
                  }
                }

Big thanks to you and your team. It is the first time where I need your help. On monthes before I only use the forum and the wiki to research my problems. What I want to say is, that thees pages are excellent to search for solutions, problems and challenges :)

Greetings from Germany

Henning

- For all who wonder about the innerHTML – I used this because in my enviroment it is the fasted method to render text …

]]> Mon, 12 Apr 2010 14:23:30 +0300 tony on table row display none style width http://www.trirand.com/blog/?page_id=393/bugs/table-row-display-none-style-width#p16168 Bugs http://www.trirand.com/blog/?page_id=393/bugs/table-row-display-none-style-width#p16168 Hello,

Thanks. No need to put screeenshot or post the code. This is true.

So little explanation: jqGrid defines a table with table layout fixed, and set the width only for the first row,

this combination make the rendering in the browsers much much faster.

One possible fix is to define first  row with height = 0 and with the appropriate widths.

This way we will not worry about which row is hidden, but we need to make this with care, since it will brake other things.

If you have any other idea it will be great.

Any way we will try to fix this.

Best Regards

Tony

]]> Sat, 03 Apr 2010 11:41:32 +0300 unknown on table row display none style width http://www.trirand.com/blog/?page_id=393/bugs/table-row-display-none-style-width#p16145 Bugs http://www.trirand.com/blog/?page_id=393/bugs/table-row-display-none-style-width#p16145 Hi all,

I have the problem, that if I set some of the table rows to display = none the width of all columns are calculated wrong. This comes only up if the first row goes display none. I think that in JQgrid internal the first table line is used to calculate width, height and so on.

A shrinktofit or forcefit brings nothing :(

I do the following to hide the lines:

                var theTable = document.getElementById('grid_articles');
                for( var z = 0; z < theTable.tBodies.length; z++ ) {
                  for( var x = 0; x < theTable.tBodies[z].rows.length; x++ ) {
                    if (theTable.tBodies[z].rows[x].cells[2].innerHTML != rowid && x != 0) {
                      if (theTable.tBodies[z].rows[x].style.display == 'none') {
                        theTable.tBodies[z].rows[x].style.display = 'table-row';
                      }
                      else {
                        theTable.tBodies[z].rows[x].style.display = 'none';
                      }
                    }
                  }
                }

Have try it with jquery hide() .. set the cells to display none .. nothings helps so I think the calculation is the key. If I let the first row displayed as you can see on the x != 0 I havn't problems. Is there some solution or can't you handle the calculation on a other way?

Do you need some screens? Just say it to me and I will bring it up to web :)

Greetings from Germany

]]> Thu, 01 Apr 2010 15:40:16 +0300