jQuery Grid Plugin - jqGrid - Topic: input width 100% with no issues when doing inline editing http://www.trirand.com/blog/?page_id=393/feature-request/input-width-100-with-no-issues-when-doing-inline-editing Simple:Press Version 5.7.5.3 snobo on input width 100% with no issues when doing inline editing http://www.trirand.com/blog/?page_id=393/feature-request/input-width-100-with-no-issues-when-doing-inline-editing#p7029 Feature Request http://www.trirand.com/blog/?page_id=393/feature-request/input-width-100-with-no-issues-when-doing-inline-editing#p7029 Don't really get what you mean, but anyway I only suggested to fix the inline/cell editing.

Just found one more place that would need fixing should you consider it possible to include, in grid.celledit.js, line #89, for example like this:

window.setTimeout(function () { $(elc).focus(); $('input',elc).focus(); },0);

]]> Wed, 03 Jun 2009 05:19:17 +0300 tony on input width 100% with no issues when doing inline editing http://www.trirand.com/blog/?page_id=393/feature-request/input-width-100-with-no-issues-when-doing-inline-editing#p6592 Feature Request http://www.trirand.com/blog/?page_id=393/feature-request/input-width-100-with-no-issues-when-doing-inline-editing#p6592 Hello,

Yes I learned this before some days too Smile

Will perform some tests and maybe include this. The problem that appear here is in form edit when we have relative smal items in select,  but the table data is relative big. In this case the look is not so impressive

Regards

Tony

]]> Sat, 09 May 2009 10:48:56 +0300 snobo on input width 100% with no issues when doing inline editing http://www.trirand.com/blog/?page_id=393/feature-request/input-width-100-with-no-issues-when-doing-inline-editing#p6522 Feature Request http://www.trirand.com/blog/?page_id=393/feature-request/input-width-100-with-no-issues-when-doing-inline-editing#p6522 Hi Tony,

I have a more or less simple suggestion how to achive real 100% input width when doing inline/cell editing. Currently, you set input width to 98%, as a dirty/partial workaround for a input width issue (when set to 100% it stretches out of cell boundaries). I say partial, because depending on user's CSS inputs may still pierce out of the cell or simply look unaligned.

So, I suggest to wrap text input in a div, and move input's borders, padding and background to this parent div (all issues disappear). I've made the following modifications:

grid.common.js

jQuery(elem).css({width:"98%"});

changes into

elem =  $('<div class="twrap"></div>').append(elem).get(0);

 grid.inlinedit.js

$(elc).addClass("editable")

changes into

if (elc.tagName=='DIV') $(elc).children().addClass("editable"); else $(elc).addClass("editable");

and in the CSS I've added the following (for example):

.grid_bdiv .twrap { padding:2px; background-color:#FFF; }
.grid_bdiv .twrap input { border:0 none; padding:0; width:100%; }

Voila! Tested in FF3, IE6/7, everything works... In grid.celledit.js a small fix is also necessary for

window.setTimeout(function () { $(elc).focus();},0);

for example,

window.setTimeout(function () { $(':input',cc).focus();},0);

dunno about other places, I guess you can know better.

Generally, 100% width of an input inside %-width table cell can be a really pain-in-the-ass problem in IE6/7, which I learnt how to cure via usage of multiple wrappers and positioning, but here in the jqGrid it's not a big deal because of the fixed column widths.

my 0.02 euro 😉

]]> Wed, 06 May 2009 08:07:38 +0300