2

How to set focus on specific cell in onSelectRow in inline edit jqgrid?

I have tried the answers from:
1. Need jqGrid inline editing to have focus go to clicked cell
2. How to set focus to cell which was clicked to start inline edit in jqgrid
3. How to edit the selected cell on jqGrid
4. Set the focus to the editable input field on select row in jqgrid

but none of that works!

So now I don't need to find what cell the user clicked, but I need the cursor to be exactly in "lg_description" column for each row. Which I guess the problem is with the e parameter, and I think when I set it to "lg_description" column, I just need to attach "lg_description" somewhere instead of e parameter.

EDITED:
This is my code:

onSelectRow: function(id, status, e){
    var grid = $(this); 
    if(id && id!==lastSel){               
        grid.restoreRow(lastSel);   
        lastSel=id;

        //cursor focus

        //first attemp: $("#lg_description").focus();
        //second attemp: $("input, select",e.target).focus();
        //third attemp: document.getElementById("lg_description").focus();
        //fourth attemp:
        /*var setFocusToCell = function(e) {
            if(!e || !e.target) return;
            var $td = $(e.target).closest("td"), $tr = $td.closest("tr.jqgrow"), ci, ri, rows = this.rows;
            if ($td.length === 0 || $tr.length === 0 || !rows) return;
            ci = $.jgrid.getCellIndex($td[0]);
            ri = $tr[0].rowIndex;
            $(rows[ri].cells[ci]).find("input,select").focus();
        }
        setFocusToCell(e);*/
    }
    grid.editRow(id, true,"","","","",aftersavefunc);  
    //fifth attemp: grid.editRow(id, true,function() {$("#lg_description").focus();},"","","",aftersavefunc);
 },

I have tried 5 different attemps where the fifth one is a substitute for the code above it

Community
  • 1
  • 1
Marsha
  • 167
  • 3
  • 3
  • 18
  • You wrote that none from above suggestions not works. If you double-click on some cell in [the demo](http://www.ok-soft-gmbh.com/jqGrid/SimpleLocalGridWithInlineEditingFocus.htm) you don't have focus in the clicked cell? Or your mean that *your code* based on the suggestion not works? Could you include the code of your accempts? You wrote about `lg_description`. Where is the corresponding code? Do you tried to place `.focus()` call inside of `setTimeout()`? Typically the setting of focus with small timeout work always. – Oleg Sep 05 '13 at 06:42
  • I mean that my code based on the suggestions didn't work. I've edited my questions to attach the code – Marsha Sep 05 '13 at 07:03
  • you makes many attempts to set focus **before** calling of `editRow` which *creates* the input fields if inline editing. Moreover I asked you to insert more full code which you use. It's strange *why* you try to use `$("#lg_description").focus();` with `lg_description` to set the focus. Is the rowid of the editing row `lg`? Is the column name is `description`? Could you include more full code which you use? At least `colModel` and test data for the grid (2 rows are enough) are required. – Oleg Sep 05 '13 at 08:45
  • lg_description is the column name and index from the col model. Oh I see, so we must call the editRow first before we can set the focus on specific cell. So I tried to implement http://stackoverflow.com/questions/6536654/how-to-edit-the-selected-cell-on-jqgrid/6538102#6538102 code again, and it works! I don't know why I failed on my attempts before. Thanks Oleg! – Marsha Sep 05 '13 at 09:30

1 Answers1

3

You makes many attempts to set focus before calling of editRow which creates the input fields if inline editing. Moreover it's strange why you try to use

$("#lg_description").focus();

with id="lg_description" to set the focus. Is the rowid of the editing row "lg"? Is the column name is "description"? The demo from the answer which you referenced set focus on the <input> or <select> in the clicked cell (children of e.target). If you want to set the focus always on specific column then you should use

$("#" + $.jgrid.jqID(id) + "_lg_description").focus();
// where "lg_description" is the column name

The usage of $.jgrid.jqID(id) instead of id is more safe, because id could have in common case meta-characters which have to be escaped in the selector. See jQuery documentation for more details.

Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • hey I try this and it works with Id "#"+id+"_description" after the id there should be underscore I think. isn't it? – DilanG Apr 04 '14 at 05:07
  • @DilanG: Yes. jqGrid uses internal function `$.jgrid.createEl` to create input/select elements used for editing or searching. Inline editing for example uses `rowid + "_" + columnName` to build the id of the editing field (see [the line](https://github.com/tonytomov/jqGrid/blob/v4.6.0/js/grid.inlinedit.js#L80)). – Oleg Apr 04 '14 at 08:03
  • I mentioned that because you missed it above answer.it isn't a big issue. anyway I edited the answer and thank you for the answer. – DilanG Apr 10 '14 at 10:56
  • @DilanG: I agree that it's better to fix the code in the answer and not only in the comment. Thanks! – Oleg Apr 10 '14 at 11:02