I am using jqGrid 4.4.1 and have this problem, not only on any specific browser, all four of them (although in different ways.)

Is this really related to the rendering engine?

As I see it, the code contains the line:

I am guessing, but does this code take the width from the definition? This code writes the width to the header cell and later on the total of the columns' width is written to the various layers.

Then in the ui.jqgrid.css there are definitions for ".ui-jqgrid .ui-jqgrid-htable TH" and ".ui-jqgrid TR.jqgrow TD" which add 2px to the left and the right of the cells and then there is 1px for the collapsed border of the table. I found this because I have one table with 13 columns and one table with three columns, the rendered difference (of the cells) is 50  pixels i.e. 5 pixels per column.

The written total width for the various layers however doesn't seem to take into account the padding in the css. This discussion about getting values from the css may help: Stackoverflow.

If one uses the approch suggested by Tony (and implemented already in the current code of jqGrid on github) the problem with Chrome 20 beta is not exist.

Best regards
Oleg

P.S. @Tony: It would be fine to publish new version of jqGrid which would include all the last fixes.

User-Agent:Mozilla/5.0 (Windows NT 5.1) AppleWebKit/536.11 (KHTML, like Gecko) Chrome/20.0.1132.11 Safari/536.11

I'm guessing 536.11 is evaluating as < 536.5 due to numeric vs text comparison causing the patch not to be operative?

You could see on the demo like this one that the fix do work. If you can provide the demo which use new code and work incorrectly then one can improve the fix. If I read just "it works not at me" I fill that I speak with a child. Sorry, but it's so. You are not the only person who posted me such kind of issues. I beleve you that there are more problems as fixed now, but without having test case which reproduce the problem we can't fix it.

So in the future I will just ignore any such posts or e-mails where no code are posted and no test case is provided. Sorry, bur I see no other way.

Best regards
Oleg

OlegK said:

Like corrently mention Justin (see here) the code still work incorrectly if the page has some existing <td> element on the page. I posted my suggestion in the comment. In any way we are very close to fixing of the problem.

Best regards
Oleg 

Hi to all,

i'm using jqGrid 3.8.2, but i've done a backporting of some functions of 4 version (setGridWidth, ShowHideCold, setColWidth),  and i tested the original fix of tony (without lastest change) in Chrome 10, 18 e 19 without problem.

Bye 

Gabriele

Best regards
Oleg 

Thanks. The function is fixed. Tested with 18 and 19 Chrom versions - return diffrent results

Regards

Tony

I named my suggestion at the beginning as quick and dirty solution, so I full agree that it would be fine to find in the future more better way. Nevetheless I don't think that the code which you wrote above will work correctly.

The first problem with above code is that ts.p.cellLayout can be set to 0. So the width of the table will be also 0. You fixed already the problem in the code of cellWidth function which can be find in the code of jqGrid on the github. The function contain the following code now:

I think that the $.jgrid.cellWidth() function returns always false. To be sure I tested it in Chrome 18 and verify that it is really so. The problem is that one uses disconnected DOM fragment. So the jQuery.width() will just get the value from the CSS style. If you would replace at the end of expression for testcell from .find("td").width() to .width() you will get 0 as the result (div has width 0). If you would remove style='width:5px;' from table element of the expression and use .find("table").width() you will get 0 too.

I think that testing (feature detection) is in general the better way. It will be possible to implement, but I think it will be need more large changes in jqGrid. I suppose that one could use jQuery.width for example for all calls from the first row, sum all the widthes and set the table width based on the value. The way has advantage that it will be used the real table (grid), so even if the user added some additional CSS classes which increase for example padding in the cells or even if the CSS used grid id only, the approach will work. The main disadvantage of the approach is the creating of the grid inside of hidden div. For example if one have jQuery UI tabs and want to create grid on the tab which currently hidden, than I suppose that all widthes will return 0.

In my original I suggested to use parseFloat($.browser.version). The main idea was to provide a solution which work correctly in Chrome and which work exactly as before on all other browsers. We can't test the new version in all other old browsers. So I wanted to have minimal changes for all other browsers. It was just pragmatical way.

Probably one can improve the way by using something like

One can change the value of old isSafari variable so that no changes for Safari will be done:

Currently Safari 5.1.7 use more old version of Webkit. The variable window.navigator.userAgent is on my computer

for Chrome 19 and

for Safari 5.1.7. If one will see that the same problem as Chrome 19 will be have the nex version of Safari one could ajust the calculation of isSafari variable to for example the original value which I suggested.

Later if one will find better and safe way one can make more changes, but I think that your current suggestion Tony works not correct.

Best regards
Oleg 

tony said:

Hello,

Thanks. Fixed in GitHub using another approach, but the result is the same.

Regards

Of course! Great!

Bye

Gabriele

Thanks. Fixed in GitHub using another approach, but the result is the same.

Regards

tony said:

Hello Oleg,

As usual – Thanks.

IMHO the better if we replace

with

This is better since it is unknown that with the next release it will be back.

Best Regards

Tony

Hi tony,

the fix above must be have done into setGridWidth and ShowHideCol functions.

those functions use $.browser.webkit || $.browser.safari condition....

My fix is:

1. Store into a parameter isSafari flag. ts.p.isSafari = isSafari;
2. use that param in  setGridWidth and ShowHideCol functions

Hope this helps

Bye

Gabriele

As usual – Thanks.

IMHO the better if we replace

with

This is better since it is unknown that with the next release it will be back.

Best Regards

Tony

I have updated today my Chrome to version 19 and could reproduce the problem described here. I wrote my suggestions in my answer on the question. I post it here too.

As quick fix of the problem one can change the line 

to

It's quick and dirty solution of cause, but how the demo demonstrate the fix works in all browsers in which I tested it.

Best regards
Oleg