FormPanel 使用

最新推荐文章于 2024-03-26 17:18:18 发布

最新推荐文章于 2024-03-26 17:18:18 发布 · 156 阅读

文章标签：

#EXT #F# #JSP

ext 专栏收录该内容

7 篇文章

订阅专栏

本文介绍如何使用ExtJS创建包含FormPanel的Window组件，并设置FormPanel的URL属性以实现表单数据的提交功能。文中提供了具体的代码示例，展示了如何验证表单、提交数据以及处理响应。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

往Ext.Window中放一个Ext.form.FormPanel，FormPanel有一个属性为url，可以设置其的值，可参照下面的代码：
//Form表单
var addManagerInfoForm = new Ext.form.FormPanel({
labelAlign:'right',
labelWidth:70,
frame:true,
url:'manage/manager/addManagerInfo.jsp?command=addManagerInfo',
items:[ mNameField,mPwdField,mEmailField,mTureNamePwdField,mPhoneField ],
buttons:[{
   text:'提交',
   handler:function(){
    var f = addManagerInfoForm.getForm();
    if(!f.isValid()) return;
    if(f.isValid()){
     f.submit({
      waitMsg:'处理中,请稍候...',
            success:function(form, action){
             if(action.result.changeManagerInfoOK===false){
              Ext.Msg.alert('信息',action.result.msg);
              return;
             }
             Ext.MessageBox.alert('提示','修改成功！',function(btn){
                               f.reset();
                               addInfoWin.hide();
                               window.history.back(-1);
                            });
            },
            failure:function(){
             Ext.Msg.alert('错误','出现异常，请重新尝试一次！');
            }
     });
    }
   }
},{
   text:'重置',
      type:'reset',
      handler:function(){
                addManagerInfoForm.getForm().reset();
            }
},{
            text:'取消',
   handler:function(){
    addManagerInfoForm.getForm().reset();
    addInfoWin.hide();
    window.history.back(-1);
   }
}]
});

//添加窗口
var addInfoWin = new Ext.Window({
title:'修改个人信息',
plain: true,
autoHeight:true,
width:300,
closeAction:'hide',
items:[addManagerInfoForm]
});