需要更改jqgrid的位置

我必须将jqgrid放置在不同的位置，而不是默认的左上角位置。我试过了一些东西，但它不起作用。我已经包含在这里我的代码.. PLZ检查，并给我一个解决方案..需要更改jqgrid的位置

这是HTML代码：

<div> 
    <table id="table" style="border-spacing: 7px 7px; margin-left: 5px"> 
     <tr> 
      <td> 
       <input style="margin-left: 10px;" type="button" value="Add" id="btn_addusers" /> 
      </td> 
     </tr> 
    </table> 
    <table id="users_grid" style="left: 300px"> 
    </table> 
</div>

这是我的js代码：

$(document).ready(function() { 
    $("#btn_addusers").click(function() { 
     $("#users_grid").clearGridData(true).trigger("reloadGrid"); 
     $("#users_grid").jqGrid({ 
      datatype: "local", 
      height: 'auto', 
      width: 'auto', 
      colNames: ['User ID', 'User Name'], 
      colModel: [ 
     { name: 'userid', width: 60 }, 
     { name: 'username', width: 120 } 

    ], 

      caption: "Users in Private space" 
     }); 
     var mydata = [ 
     { userid: "312171", username: "D, Gnana Xavier" }, 
     { userid: "311763", username: "Sangeetha" }, 
     { userid: "312185", username: "Amrutha" }, 
     { userid: "312186", username: "Ramesh" } 
     ]; 
     for (var i = 0; i <= mydata.length; i++) 
      $("#users_grid").jqGrid('addRowData', i + 1, mydata[i]); 

    }); 
});

来源

2012-11-12 Xavier

我不建议你使用'addRowData'。这是填补电网最慢的方法。而不是你应该在*创建网格之前移动'mydata'数组*的定义，并且在jqGrid选项中添加'data：mydata'和'gridview：true'。此外，我建议你将'id'属性添加到'mydata'的每个项目。 'id'属性将被用作网格的''元素（行）的'id'。 – Oleg

@Oleg感谢您的建议..这真的是一个有用的信息..将来会避免.. – Xavier

不客气！ – Oleg

的jqGrid创造了许多额外的 div表格元素。因此，您应该将<table>元素放置在<div>的内部，并且您可以使用外部div的样式来更改表格的位置。例如

<div style="margin-left: 300px"> 
    <table id="users_grid"></table> 
</div>

来源

2012-11-12 08:22:37 Oleg

这很好。谢谢你.. :) – Xavier

@Xavier：不客气！ – Oleg

我需要另一个与jqgrid相关的帮助..你能否请检查一下http://stackoverflow.com/questions/13411956/add-new-row-to-a-jqgrid – Xavier

好像@aristos建议。我正在试着解释我的答案。
用户位置=相对在div如下

<div style="position:relative;"> 
    <table id="table" style="border-spacing: 7px 7px; margin-left: 5px"> 
     <tr> 
      <td> 
      <input style="margin-left: 10px;" type="button" value="Add" id="btn_addusers" /> 
      </td> 
     </tr> 
    </table> 
    <table id="users_grid" style="left: 300px;position:absolute!important;"> 
    </table> 
</div>

注意

如果父容器的位置是相对的位置：相对于
和内容的现在的位置是绝对那么它可以在容器中移动。
现在您可以使用左和顶部 attribut移动表。
但它不会超出div。

来源

2012-11-12 08:28:20

感谢您的时间..我得到了我的答案来自oleg .. – Xavier

@ShekharKumar：您的建议将适用于常见的'

'元素，但jqGrid *修改*并将'

'作为另一个具有'position：relative;'的外部div的子元素。因此，使用'position：absolute'将会导致表格的内容（主体）根本看不到。所以你的建议在jqGrid的使用上下文中不起作用。 – Oleg

需要更改jqgrid的位置

回答

相关问题