基本
大家好,我在jqGrid wiki上看到tableToGrid方法(由Peter Romianowski提供)定义为tableToGrid(selector, options)
,但找不到任何有options
有谁知道这些或在哪里找到它们?编辑:谢谢奥列格,已经解决了!
更多
我实际上要做的是将生成的jqGrid包含在form
中,这将提交表格列中的checkbox
值。我的问题是tableToGrid
方法似乎是从name
元素中删除了checkbox
属性,因此它们没有通过表单发布。
答案 0 :(得分:7)
就像您可以在http://www.trirand.com/jqgridwiki/doku.php?id=wiki:table_to_jqgrid上阅读一样,tableToGrid
方法的options参数仅仅是您创建的jqGrid的选项(请参阅http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options)。
如果我不想要你的主要问题,你可以从服务器收到一些数据作为表格提交的答案。并且您希望将此数据放在网格中。为了实现这一点,您可以使用jqGrid的datatype: 'local'
更直接的方式。这是一个例子:
var grid = jQuery('#list').jqGrid({
caption: 'Testclusters',
height: 'auto',
gridview: true,
rownumbers: true,
sortable: true,
datatype: 'local',
viewrecords: true,
pager: '#pager',
pgbuttons: false,
pginput: false,
rownumbers: true,
colNames: ['Name', 'Testtiefe', 'Std', 'FachlicheTests', 'RowVersion'],
colModel: [
{ name: 'Name', index: 'Name', width: 120 },
{ name: 'TesttiefeName', width: 180 },
{ name: 'Std', width: 21, formatter: 'checkbox', align: 'center' },
{ name: 'IsFachlicheTests', width: 21, formatter: 'checkbox', align: 'center' },
{ name: 'RowVersion', width: 50, hidden: true }
]
}).navGrid('#pager', { edit: false, add: false, del: false, refresh: true, view: false, search: false })
.navButtonAdd('#pager', { caption: "", buttonicon: "ui-icon-calculator", title: "choose columns",
onClickButton: function() {
jQuery('#list').jqGrid('columnChooser');
}
});
grid.jqGrid('gridResize');
var myData = [
{ Name: "VIA XP", TesttiefeName: "Alle SW-Produkte", Std:true, IsFachlicheTests:false, RowVersion: "20FC31" },
{ Name: "KUBUS", TesttiefeName: "Alle SW-Produkte", Std:false, IsFachlicheTests:true, RowVersion: "20FC32" }
];
for (var i = 0; i <= myData.length; i++) {
grid.addRowData(i + 1, myData[i]);
}
首先,您创建一个空的jqGrid,然后使用addRowData
方法填充它。
此外,如果你在jqGrid中有很多复选框,那么从Vertical text inside table headers using a JavaScript-based SVG library查看我的示例并查看http://www.ok-soft-gmbh.com/VerticalHeaders/TestFixedO1.htm上的结果会很有趣。
答案 1 :(得分:1)
<强>分辨强>
jqGrid tableToGrid方法将在原始表中找到复选框的值,并在生成的jqGrid上自动实现multiSelect: true
选项,显示内部复选框。要获取所选行ID的列表,只需调用
$('#grid').getGridParam('selarrrow')
答案 2 :(得分:0)
更改任意列数的列宽
在这种情况下,在jqgrid构建之后,您可以直接转到表生成并手动更改列标题和相应数据的所有列宽,而无需使用繁琐的代码。
var tabColWidths ='70px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px|125px';
function reDefineColWidth(){
var widthsArr = tabColWidths.split('|');
for(var j=0; j < widthsArr.length ; j++ ){
$('.ui-jqgrid-labels > th:eq('+j+')').css('width',widthsArr[j]);
$('#grid tr').find('td:eq('+j+')').each(function(){$(this).css('width',widthsArr[j]);})
}
}