SMART datagrid v.1 > Examples

Back  Forward

Row Updating  Example

修改数据行的方法有很多种,而本次例题中,我们将会了解通过用户输入而变更现有行的值的方法。 如果使用SMART datagrid网格内编辑功能,就可以体现类似于现有桌面的用户输入UI。 

为了使用户可直接编辑数据单元格并且修改行, 首先需要将GridBase.editOptionsreadOnly设置为false并且将updatable设置为true (两个都是默认值)。 可以通过将焦点移动至将要编辑的行的数据单元格上,并且输入F2键, 预先显示编辑器,或直接输入文本键,开始单元格编辑。 

进行编辑后,为了提交行修改,可以使用上下方向键或鼠标而移动行。 而且,可以通过按Esc键,取消编辑。 当开始行修改时,row indicator单元格上将会显示修改记号,而如果提交编辑并且实际进行行修改,row indicator状态单元格的颜色将会发生变化。 

Grid - 1
rows

当提交行修改时,将会触发数据组的onRowUpdated事件。 在修改数据组的行之前,将会触发onRowUpdating事件,而如果在这个事件处理器中明确返回false,就会取消行修改。 

而且,也可以阻止在网格级别开始行修改。 如果在网格的onUpdating事件处理器中明确返回false,就无法开始修改。 

 

 

Code -1
    grdMain.onUpdating = function (grid, rowIndex) {
        if ($('#chkEventUpdatable').is(':checked')) {
            return false;
        } 
    };

替代用户输入方式,可以通过调用GridBase.edit方法,开始行修改。 

 

查看源代码 JSP 

See Also
EditOptions
RowIndicator
GridBase.editOptions
GridBase.rowIndicator
GridDataSet.onRowUpdating
GridDataSet.onRowUpdated
GridBase.onUpdating
GridBase.edit
GridBase.showEditor
Examples
行添加
行删除
单元格编辑
状态单元格
编辑事件
编辑键