如何将光标从第二列移动到第一列jqgrid的新行中

问题描述：

我是jqgrid的新手。我有下面的代码来插入一个新行时，按Tab键。它大部分适用于它。但是当插入一个新行时，焦点将被赋予该行中的第二列而不是第一列。如何将光标从第二列移动到第一列jqgrid的新行中

我该如何解决这个问题？

HTML：

<table id="list11"></table> 
<!--<div id="paddtree"></div>--> 
<label>press tab to add new row</label> 
<script> 
    var selIRow = 1; 
     var lastsel2 
     jQuery("#list11").jqGrid({ 
    // url:'d/${jobId}.htm', 
      datatype: "json", 
      colNames: ['First Name', 'Email ID', 'Phone Number'], 
      colModel: [ 
       // {name:'id',index:'id', width:75, search:true, stype:'text' , search:true, sortable:true}, 
       {name: 'firstName', width: 180, search: true, stype: 'text', sortable: true, editable: true, }, 
       {name: 'email', index: 'email', width: 250, editable: true}, 
       {name: 'phoneNumber', index: 'phoneNumber', width: 100, align: "right", editable: true, 
        editoptions: { 
         dataInit: function(elem) { 
          $(elem).focus(function() { 
           this.select(); 
          }) 
         }, 
         dataEvents: [ 
          { 
           type: 'keydown', 
           fn: function(e) { 
            var key = e.charCode || e.keyCode; 
            if (key == 9 || key == 15)//tab 
            { 
             var grid = $('#list11'); 
             //Save editing for current row 
             grid.jqGrid('saveRow', selIRow, false, 'clientArray'); 
             //If at bottom of grid, create new row 
             // alert(grid.getDataIDs().length); 
             if (selIRow++ == grid.getDataIDs().length) { 

              grid.addRowData(selIRow, {}); 
             } 
             //Enter edit row for next row in grid 
             grid.jqGrid('editRow', selIRow, true, 'clientArray'); 

            } 
           } 
          } 
         ] 
        }, }, 
      ], 
      beforeRequest: function(data) { 
       var grid = $('#list11'); 

       grid.addRowData(grid.jqGrid('getGridParam', 'records') + 1, {}); 
       grid.jqGrid('editRow', selIRow, false, 'clientArray'); 


      }, 
      onSelectRow: function(id) { 
       if (id && id !== lastsel2) { 

        jQuery('#list11').jqGrid('restoreRow', lastsel2); 
        jQuery('#list11').jqGrid('editRow', id, true); 
        lastsel2 = id; 
       } 
      }, 
      // editurl: "data/add.htm", 
      sortname: 'id', 
      viewrecords: true, 
      sortorder: "desc", 
    caption: "Candidates applied for <bold> ${job.getTitle()}</bold>", 
      // pager : "#paddtree", 
      emptyrecords: "new", 
     }); 
</script>

感谢。

if (key == 9 || key == 15) //tab 
{ 
    e.preventDefault(); 
    //do your other stuff...

你有没有tryed e.stopPropagation（）当您设置一个新行进行编辑？即时通讯不知道，但也许发生的事情是，你开始编辑一行，焦点给予第一个输入，但然后事件传播并通过焦点到下一个输入 – cernunnos 2013-05-03 11:10:53

我有许多问题，你发布的代码。第一个：你如何填充网格（你使用'datatype：“json”'所以它应该是'url'选项）？你没有定义'editurl'。你可以在一些地方指定''clientArray''作为'url'。你想只在本地修改数据吗？此外，您设置了第三列（'phoneNumber'）的焦点，而且以错误的方式设置焦点，但是您写了“焦点赋予该行中的第二列而不是第一列”。你想要实现什么行为？ – Oleg 2013-05-03 11:10:56

@Oleg我已经指定了'URL'和'EDITURL'，但只有在这里我已经注释掉了。 – 2013-05-03 11:16:05

答

你的榜样工程。这样可以防止预定义的动作，例如在点击打开新的标签页....

或者

个人没有使用jgrid但语法是用jQuery数据表一样。它非常灵活，它有一个令人敬畏的文档看看它。

答

使用e.preventDefult();：如果您使用e.preventDefault（）

答

所有你必须做你的代码中添加一行e.preventDefault();这里：

if (key == 9 || key == 15)//tab 
{ 
    e.preventDefault(); 
    ...

如何将光标从第二列移动到第一列jqgrid的新行中

相关推荐