1

我正在使用基于 IgGrid 的 jquery，我正在尝试按照以下方式设置网格：

function igGridBind() {
    $("#JournalGrid").igGrid({
        dataSourceType: 'json',
        dataSource: journals,
        primaryKey: "journal_id",
        featureChooserIconDisplay: "always",
        autoGenerateColumns: false,
        autoGenerateLayouts: false,
        rowVirtualization: true,
        virtualizationMode: "continuous",
        autoCommit: true,
        width: "100%",
        height: "800px",
        columns: columns,
        features: [
        { name: "Paging", pageSize: 20 },
        {
            name: 'Updating',
            enableAddRow: true,
            enableDeleteRow: true,
            editMode: 'row',
            columnSettings: [{
                columnKey: "journal_id",
                editorType: 'numeric',
                editorOptions: { readOnly: true }
            }, {
                columnKey: "journal_gl_id",
                editorType: 'numeric',
                editorOptions: { readOnly: true }
            }, {
                columnKey: "journal_gl_chart_id",
                editorType: 'combo',
                required: true,
                editorOptions: {
                    mode: "dropdown",
                    dataSourceType: 'json',
                    dataSource: chartCombo,
                    textKey: "chart_master_code",
                    valueKey: "chart_master_id"
                }
            }, {
                columnKey: "journal_gl_description",
                editorType: 'string',
                validation: true,
                editorOptions: { required: true }
            }, {
                columnKey: "journal_gl_net",
                editorType: 'numeric',
                validation: false,
                editorOptions: { required: false }
            }, {
                columnKey: "journal_gl_debit",
                editorType: 'numeric',
                validation: false,
                editorOptions: { required: false }
            }, {
                columnKey: "journal_gl_credit",
                editorType: 'numeric',
                validation: false,
                editorOptions: { required: false }
            }]
        }
        ]
    });
}

var columns = [
        { headerText: "JournalID", key: "journal_id", dataType: "number", hidden: true, allowHiding: false },
        { headerText: "JournalGlID", key: "journal_gl_id", dataType: "number", hidden: true, allowHiding: false },
        { headerText: "Chart", key: "journal_gl_chart_id", dataType: "number", width: "30%", formatter: formatChartCombo },
        { headerText: "Description", key: "journal_gl_description", dataType: "string", width: "30%" },
        { headerText: "Net", key: "journal_gl_net", dataType: "number", hidden: true, allowHiding: false },
        { headerText: "Debit", key: "journal_gl_debit", dataType: "number", width: "20%" },
        { headerText: "Credit", key: "journal_gl_credit", dataType: "number", width: "20%" }

如果我使用editMode：'row'，完成和取消按钮工作并且grid.on（“iggridupdatingeditrowended”，函数（e，args）在单击完成按钮后被调用。但是没有任何验证工作。当我使用选项卡时，焦点将进入下一列，如果是最后一列，它将聚焦完成按钮，单击完成后，调用 rowended 方法（如预期的那样）。但是，每次我从一列失去焦点并转到下一个

选项卡错误（失去焦点列并转到下一个）

另一方面，如果我使用 editMode : 'cell'，则不会出现此错误，并且验证将起作用，并且将触发事件“keydown”和“keyup”。但是，完成和取消按钮不会呈现。

有谁知道是否有办法同时设置这两个功能？如果开箱即用无法实现，我将如何打开“完成”和“取消”按钮模式弹出窗口？所以我将能够在第一个焦点列中呈现，并在最后一列之后单击焦点完成？或者如果有人可以指出一个示例代码，我可以在其中遵循可定制的 igGrid 更新功能

当前项目使用这些版本：

  • Infragistics.Web.Mvc 版本 5.17.2.183。
  • jquery-1.10.2.min.js
  • jquery-ui-1.10.4.min.js

我的公司有 2017 版本，但我想知道哪个是与 2017 版本一起使用的最佳 jquery 版本，如果这个 5.17.2.183 是我可以与 2017 许可证一起使用的最新 dll？

编辑：

还添加 EditMode : 'dialog' 不是一个选项，它基本上呈现一个包含所有列的模式弹出窗口，因此行受到威胁，因为它是一个表单

4

1 回答 1

1

经过更多调查，igGrid 已被修改（语法）。我正在关注最“完整”的文档之一2012 版本，并且在过去几年中，此语法已更改：

  • 无需添加不需要验证的列，这是新语法的实际设置：

function igGridBind() {
	$("#JournalGrid").igGrid({
		dataSourceType: 'json',
		dataSource: journals,
		primaryKey: "journal_id",
		featureChooserIconDisplay: "always",
		autoGenerateColumns: false,
		autoGenerateLayouts: false,
		rowVirtualization: true,
		virtualizationMode: "continuous",
		autoCommit: true,
		width: "100%",
		height: "800px",
		columns: columns,
		features: [
		{ name: "Paging", pageSize: 20 },
		{
			name: 'Updating',
			enableAddRow: true,
			enableDeleteRow: true,
			editMode: 'row',
			columnSettings: [
				{
					columnKey: "journal_gl_chart_id",
					editorType: 'combo',
					required: true,
					editorOptions: {
						mode: "dropdown",
						dataSourceType: 'json',
						dataSource: chartCombo,
						textKey: "chart_master_code",
						valueKey: "chart_master_id"
					}
				}
				,
				{
					columnKey: "journal_gl_description",
					editorType: 'string',
					required: true
				}
			]
		}
		]
	});
}

于 2018-03-01T22:37:18.530 回答