StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I suppose that the problem exist because one hide a button which has currently focus. Look at the code from <a href="https://stackoverflow.com/questions/7126810/jqgrid-inline-edit-save-handler-when-clicking-enter">the answer</a>. If one remove the line <code>$(this).focus(); // set focus somewhere</code> one has the same problem as you describes. So I suggest that you just try to set somewhere, for example in <code>restoreActionsIcons</code> the focus to any the <code>table</code> element of the grid after hiding the button having currently the focus. I can't test this, but I hope it will help.</p> <p><strong>UPDATED</strong>: I examined your problem one more time and I hope I can suggest you a solution.</p> <p>You problem can be divided on two sub-problems. The main your problem is the the <em>changing of the id of the row</em>. So it is not common problem which everybody has.</p> <p>The problem is that "actions" formatter create <code>onclick</code> functions directly in the HTML code (see for example <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L468" rel="nofollow noreferrer">here</a>):</p> <pre><code>ocl = "onclick=$.fn.fmatter.rowactions('"+rowid+"','"+opts.gid+"','edit',"+opts.pos+");..." </code></pre> <p>So the functions will contains the <strong>original</strong> rowid. To fix the problem you can modify the code fragment of your <code>aftersavefunc</code> inside of <code>setTimeout</code> from</p> <pre><code>$("#" + rowID).attr("id", json.Id); lastSelectedRow = json.Id; $("#grid").jqGrid('setSelection', lastSelectedRow); </code></pre> <p>to something like the following:</p> <pre><code>var $tr = $("#" + rowID), $divEdit = $tr.find("div.ui-inline-edit"), $divDel = $tr.find("div.ui-inline-del"), $divSave = $tr.find("div.ui-inline-save"), $divCancel = $tr.find("div.ui-inline-cancel"); $tr.attr("id", json.Id); if ($divEdit.length > 0) { $divEdit[0].onclick = function () { $.fn.fmatter.rowactions(newId,'grid','edit',0); }; } if ($divDel.length > 0) { $divDel[0].onclick = function () { $.fn.fmatter.rowactions(newId,'grid','del',0); }; } if ($divSave.length > 0) { $divSave[0].onclick = function () { $.fn.fmatter.rowactions(newId,'grid','save',0); }; } if ($divCancel.length > 0) { $divCancel[0].onclick = function () { $.fn.fmatter.rowactions(newId,'grid','cancel',0); }; } lastSelectedRow = json.Id; $("#grid").jqGrid('setSelection', lastSelectedRow); </code></pre> <p>The second problem is that you use special characters inside of ids. I found a bug in the <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L394" rel="nofollow noreferrer">$.fn.fmatter.rowactions</a> which need be fixed to support special characters in ids. The problem is that in the line <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L407" rel="nofollow noreferrer">407</a> of <code>jquery.fmatter.js</code> the original rowid parameter <code>rid</code> will be changed:</p> <pre><code>rid = $.jgrid.jqID( rid ) </code></pre> <p>and later everywhere will be used modified id. For example in the id is <code>my.id</code> the encoded version will be <code>my\\.id</code>. It's correct for the most places of the <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L394" rel="nofollow noreferrer">$.fn.fmatter.rowactions</a> code (see <a href="http://api.jquery.com/category/selectors/" rel="nofollow noreferrer">here</a>), but it' s incorrect as the rowid parameter of the <code>editRow</code>, <code>saveRow</code>, <code>restoreRow</code>, <code>delGridRow</code>, <code>setSelection</code> and <code>editGridRow</code> (see the lines <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L433" rel="nofollow noreferrer">433</a>-<a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L453" rel="nofollow noreferrer">453</a>). So the code must be fixed to use the <strong>original not escaped (not encoded)</strong> <code>rid</code> value with which the <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L394" rel="nofollow noreferrer">$.fn.fmatter.rowactions</a> was called.</p> <p>I think I will post tomorrow the corresponding bug report with the suggestions in <a href="http://www.trirand.com/blog/?page_id=393/bugs/" rel="nofollow noreferrer">the trirand forum</a>.</p> <p><strong>UPDATED 2</strong>: The code <code>$.fn.fmatter.rowactions(newId,'grid','edit',0);</code> which I wrote above is <strong>just an example</strong>. I took it from the test demo which you send me. You should of course <strong>modify</strong> the code for your purpose. How you can see for example from <a href="https://github.com/tonytomov/jqGrid/blob/v4.1.2/js/jquery.fmatter.js#L474" rel="nofollow noreferrer">the line</a> the second parameter of the <code>$.fn.fmatter.rowactions</code> in the id of the grid which you use: 'grid', 'list' of something like <code>myGrid[0].id</code>. The last parameter should be the <em>index</em> of the column having <code>formatter:'actions'</code> in the <code>colModel</code>. You can use <code>getColumnIndexByName</code> function from <a href="https://stackoverflow.com/questions/6575192/jqgrid-change-background-color-of-row-based-on-row-cell-value-by-column-name/6575634#6575634">the answer</a> on your old question to get the index by column name.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload