解决Easyui Tab href 加载对话框中form重复提交问题

最新推荐文章于 2018-08-29 11:25:58 发布

原创最新推荐文章于 2018-08-29 11:25:58 发布 · 1.3k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#easyui #对话框 #from #重复提交

Web 专栏收录该内容

4 篇文章

订阅专栏

本文探讨了使用EasyUI框架时遇到的一个问题：当Tab页被关闭后重新打开时，对话框会重复加载，导致表单重复提交。文章提供了一个临时解决方案，即记录并销毁已加载的对话框。

原因分析：

只要是对话框，或者Window，Easyui都会将其放到body下，tab控件通过href加载对话框后，对话框也会放到body下，当tab被关闭时，处于body下的对话框不会被销毁，再次打开时就会重复加载，从而form会重复提交。

临时解决方法是，先记录下href加载了哪些对话框，在tab被关闭时，去destroy那些对话框。

$('#tabs').tabs('add', {
                                    id: node.id,
                                    title : node.text,
                                    href : '/core/showPage.php?page=' + node.href,
                                    selected : true,
                                    iconCls : node.iconCls,
                                    closable : true,
                                    onLoad: function(){
                                        var pageID = 'hxPageID' + this.id, body = $('body');
                                        body.find('div.panel.window>div.panel-body.panel-body-noborder.window-body').filter(function() {
                                            return ( ! $(this).hasClass('hxAutoDlg'));
                                        }).addClass( 'hxAutoDlg ' + pageID );
                                        body.find('input.combo-f').filter(function(){
                                            return ( ! $(this).hasClass('hxAutoComb'));
                                        }).addClass('hxAutoComb ' + pageID );
                                        body.find('input.searchbox-f').filter(function(){
                                            return ( ! $(this).hasClass('hxASearchBox'));
                                        }).addClass('hxASearchBox ' + pageID );
                                        body.find('input.textbox-f').filter(function(){
                                            var _this = $(this);
                                            return ( ! ( _this.hasClass('hxAutoComb') || _this.hasClass('hxASearchBox') || _this.hasClass('hxADText')));
                                        }).addClass('hxADText ' + pageID );
                                        body.find('a.m-btn:has(span>span.m-btn-downarrow)').filter(function(){
                                            return ( ! $(this).hasClass('hxABtmenu'));
                                        }).addClass('hxABtmenu ' + pageID );
                                    },
                                    onBeforeDestroy: function() {
                                        var pageID = 'hxPageID' + this.id, body = $('body');
                                        body.find('a.hxABtmenu.' + pageID ).each(function(){
                                            var _this = $(this);
                                            if( _this.hasClass('s-btn'))
                                                _this.splitbutton('destroy');
                                            else
                                                _this.menubutton('destroy');
                                        });
                                        body.find('input.hxADText.' + pageID ).each( function(){
                                            var _this = $(this);
                                            if( _this.hasClass('numberspinner-f'))
                                                _this.numberspinner('destroy');
                                            else if( _this.hasClass('numberbox-f'))
                                                _this.numberbox('destroy');
                                            else
                                                _this.textbox('destroy');
                                        });
                                        body.find('input.hxASearchBox.' + pageID ).each( function(){
                                            $(this).searchbox('destroy');
                                        });
                                        body.find('input.hxAutoComb.' + pageID ).each(function(){
                                            var _this = $(this);
                                            if( _this.hasClass('combogrid-f'))
                                                _this.combogrid('destroy');
                                            else if( _this.hasClass('combotree-f'))
                                                _this.combotree('destroy');
                                            else if( _this.hasClass('datebox-f'))
                                                _this.datebox('destroy');
                                            else
                                                _this.combobox('destroy');
                                        });
                                        body.find('.hxAutoDlg.' + pageID ).each(function(){
                                            $(this).dialog('destroy');
                                        });
                                    }
                                });