首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

施用Ext的Grid,Form,Dialog来实现分页列表,创建,修改,删除功能(续)

2012-11-22 
使用Ext的Grid,Form,Dialog来实现分页列表,创建,修改,删除功能(续)前面已经把列表,分页,删除等部分说完了,

使用Ext的Grid,Form,Dialog来实现分页列表,创建,修改,删除功能(续)
前面已经把列表,分页,删除等部分说完了,这里再把创建和修改说说,基本的功能就差不多了.

创建

在这里,创建和修改者是用Dialog的形式来做的,首先则需要创建相应的DIV:

<!-- add div -->
    <div id="a-addInstance-dlg" style="visibility:hidden;">
        <div style="visibility:hidden;">
        <div class="x-layout-inactive-content">
                <div id="a-updateInstance-form"></div>
            </div>
        </div>
    </div>

双击某条记录,则会弹出修改Dialog了,大概的样子如下:



修改的处理事件与添加类似,需要注意的地方就是ID是怎么传过去的:

saveUpdateForm : function() {
                if (Grid.editForm.isValid()) {
                    Grid.editForm.submit({
                        params : { id : Grid.updateId},
                        waitMsg : '正在更新数据...',
                        reset : false,
                        failure : function(form, action) {
                                Ext.MessageBox.alert('友情提示', action.result.info);
                            },
                        success : function(form, action) {
                            Grid.updateInstanceDlg.hide();
                            Grid.ds.reload();
                        }
                    });                   
                } else {
                    Ext.MessageBox.alert('错误', '字段填写不正确!');
                }
            }

到此就Over啦,列表,添,删,改都OK了.在没有做的时候,总是感觉找不到入口点,做完之后才发现,原来自己担心的问题,都不是问题,哈,想想,还是挺简单的.

热点排行