Soo.. 我有一个 EditableGrid 的示例(http://www.editablegrid.net/),这是一个非常酷的网格,它可以让我将数据从 mysql 表加载到 html 网格,并进行排序、内联编辑 + mysql 数据库更新。我从另一个示例中添加了过滤功能,但正在努力添加删除行和添加行功能。
我找到了一个如何通过添加新列来删除的示例,我可以从那里调用更新函数..但我在语法和放置它的位置上苦苦挣扎..到目前为止,javascript 让我难以置信.. http:// /www.editablegrid.net/editablegrid/examples/simple/index.html
输出被加载到一个简单的 html 文件中的 div 上,并且运行良好.. 很好,很快并且更新得很好。我只想在表格中添加“新”和“删除”功能。
任何帮助表示赞赏。
function DatabaseGrid()
{
this.editableGrid = new EditableGrid("plan_customerid", {
enableSort: true,
editmode: "absolute",
editorzoneid: "edition",
tableLoaded: function() {
datagrid.initializeGrid(this);
},
modelChanged: function(rowIndex, columnIndex, oldValue, newValue, row) {
updateCellValue(this, rowIndex, columnIndex, oldValue, newValue, row); },
});
this.fetchGrid();
}
DatabaseGrid.prototype.fetchGrid = function() {
// call a PHP script to get the data
this.editableGrid.loadXML("loaddata.php");
};
DatabaseGrid.prototype.initializeGrid = function(grid) {
grid.renderGrid("tablecontent", "testgrid", "tableid");
tableRendered = function() { this.updatePaginator(); };
_$('filter').onkeyup = function() { grid.filter(_$('filter').value); };
};
loaddata.php 的输出是这样的:
<table>
<metadata>
<column name="customer_id" label="UID" datatype="string" editable="true"></column>
<column name="customer" label="Customer" datatype="string" editable="true"></column>
<column name="lastchange_by" label="Editor" datatype="string" editable="true"></column>
<column name="ts" label="Timestamp" datatype="date" editable="true"></column>
</metadata>
<data>
<row id="1">
<column name="customer_id">
<![CDATA[ 5000 ]]>
</column>
<column name="customer">
<![CDATA[ Foo ]]>
</column>
<column name="lastchange_by">
<![CDATA[ Bar ]]>
</column>
<column name="ts">
<![CDATA[ 2013-10-17 00:00:00 ]]>
</column>
</row>
</data>
</table>