ExtJS学习之formPanel

最新推荐文章于 2023-06-17 22:40:09 发布
最新推荐文章于 2023-06-17 22:40:09 发布
阅读量699 收藏
点赞数
分类专栏： 前端技术 EXTJS java web 文章标签： extjs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012439957/article/details/35270253
版权
java web 同时被 3 个专栏收录
13 篇文章 1 订阅
订阅专栏
前端技术
5 篇文章 0 订阅
订阅专栏
EXTJS
4 篇文章 0 订阅
订阅专栏

     最近几天在学习ExtJS这个强大的前端框架，俗话说好记性不如烂笔头，为了怕以后写过的例子给忘了，现在把写完的页面记录下来，以便未来的日子复习以下，O(∩_∩)O哈哈~

废话不多说，今天带来的是ExtJS中的FormPanel组件，EXT的搭建环境略过。。以后在整理：

HTML页面：

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>查看详细</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!--请自己手动引入extjs的相关文件-->
<script type="text/javascript" src="testFormPane.js"></script>
</head>
<div id="form"></div>
</html>
testFormPanel.js 
Ext.onReady(function(){
    
    /*****************************************分割符**************************************************************
     */
    //htmlEditor需要这个
    Ext.QuickTips.init();
     
    //定义查询数据条件    
    var data = [['文本1','文本1'],['文本2','文本2']];
    var storeCombo = new Ext.data.ArrayStore({
            fields:['value','text'],
            data:data
    });
    
    var form = new Ext.form.FormPanel({
        labelAlign : 'right',
        labelWidth : 50,
        width : 1000,
        title : 'form测试',
        frame : true,
        tbar  : [
            {
                xtype :'label',
                style : 'padding:5px 5px 5px 15px;',
                text : '文本:',
                columnWidth : 0.05
            },{
                itemId : 'wenben',
                xtype : 'combo',
                store : storeCombo,
                displayField : 'text',
                valueField : 'value',
                mode : 'local',
                allowBlank : false,// 不为空
                columnWidth : 0.1,
                emptyText : '请输入......'
            }, {
                text : '查询',
                xtype : 'button',
                iconCls : 'search',
                columnWidth : 0.07,
                handler : function() {
                    // 查询方法
                    querywb();
                }
                }],
        items : [{
            layout : 'column',
            items : [{
                columnWidth :.7,
                xtype : 'fieldset',
                checkboxToggle : true,
                title : '输入区域',
                autoHeight : true,
                defaults : {width: 300},
                defaultType : 'textfield',
                items : [{
                    fieldLabel : '文本',
                    name : 'text',
                    emptyText : '请输入文本'
                },{
                    xtype : 'numberfield',
                    fieldLabel : '数字',
                    name : 'num',
                    emptyText : '请输入数字类型值'
                },{
                    xtype : 'combo',
                    fieldLabel : '选择框',
                    name : 'combo',
                    store : new Ext.data.SimpleStore({
                        fields : ['value','text'],
                        data : [
                            ['value1','选项一'],
                            ['value2','选项二'],
                            ['value3','选项三']
                        ]
                    }),
                    displayField : 'text',
                    valueField : 'value',
                    mode : 'local',
                    emptyText : '请选择选项'
                },{
                    xtype : 'datefield',
                    fieldLabel : '日期',
                    name : 'date',
                    format : 'Y-m-d',
                    emptyText : '请选择日期'
                },{
                    xtype : 'timefield',
                    fieldLabel : '时间',
                    name : 'time',
                    emptyText : '请选择时间',
                    minValue :'10:00 AM',
                    maxValue : '14:00 PM',
                    format:'H:i:s',
                    increment : 30
                },{
                    xtype : 'textarea',
                    fieldLabel : '多行',
                    name : 'textarea',
                    maxLength : 50,
                    minLength : 10
                },{
                    xtype : 'hidden',
                    name : 'hidden'
                }]
            },
            {
                columnWidth : .3,
                layout : 'form',
                items : [{
                    xtype : 'fieldset',
                    checkboxToggle : true,
                    title : '多选',
                    autoHeight : true,
                    hideLabels : true,
                    style : 'margin-left:10px;',
                    bodyStyle : 'margin-left:20px;',
                    items :[{
                            name : 'expResult',
                            anchor : '90%',
                            xtype : 'checkboxgroup',
                            items : [{
                                        boxLabel : '1',
                                        name : 'check1',
                                        value : '1',
                                        inputValue :'1',
                                        checked : true,
                                        width : 'auto'
                                    },{
                                        boxLabel : '2',
                                        name : 'check2',
                                        value : '2',
                                        inputValue :'2',
                                        checked : true,
                                        width : 'auto'
                                    },{
                                        boxLabel : '3',
                                        name : 'check3',
                                        inputValue :'3',
                                        value : '3',
                                        checked : true,
                                        width : 'auto'
                                    }]
                        }]
                },{
                    xtype : 'fieldset',
                    checkboxToggle : true,
                    title : '单选',
                    autoHeight : 'true',
                    hideLabel : true,
                    style : 'margin-left:10px;',
                    bodyStyle : 'margin-left : 20px;',
                    items : [
                            {
                             name :'radio',
                             xtype:'radiogroup',
                             items :[
                                {
                                    boxLabel : '渴望自由',
                                    name : 'rad',
                                    value : '1',
                                    checked : true,
                                    width : 'auto'
                                },{
                                    boxLabel : '祈求爱情',
                                    name : 'rad',
                                    value : '2',
                                    width : 'auto'
                                }]
                        }]
                }]
            }]
        },{
            layout : 'form',
            labelAlign : 'top',
            items : [{
                xtype : 'htmleditor',
                fieldLabel : '在线编辑器',
                name :'editor',
                id : 'editor',
                anchor : '98%'
            }]
        }],
        buttons : [{
                text : '保存',
                handler : function(){
                    save();
                }
            },{
                text : '读取'
            },{
                text : '取消'
            }]
        
    });
        form.render("form");//将formpanel面板渲染到页面div中
        
        
        var save = function(){
           var savedata;//用来存放获取的要保存的数据 
           var saveCheckresult = [];
           var inputValues = [];
           var checkresult = form.getForm().findField('expResult').getValue();//获取复选框的内容
           for (var i = 0; i< checkresult.length;i++){
                //saveCheckresult.push(checkresult[i].vlaue);
                inputValues.push(checkresult[i].inputValue);
           }
           var radioresult = form.getForm().findField('radio').getValue();
            
           saveData = "{'id':'"+form.getForm().findField('hidden').getValue()+"',";
           saveData += "'wenben':'"+form.getForm().findField('text').getValue()+"',";
           saveData += "'num':"+form.getForm().findField('num').getValue()+",";
           saveData += "'cdate':'"+form.getForm().findField('date').getRawValue()+"',";
           saveData += "'ctime':'"+form.getForm().findField('time').getValue()+"',";
           saveData += "'combo':'"+form.getForm().findField('combo').getValue()+"',";
           saveData += "'area':'"+form.getForm().findField('textarea').getRawValue()+"',";
           saveData += "'checked':'"+inputValues+"',";
           saveData += "'radioed':'"+form.getForm().findField('radio').getValue().value+"',";
           saveData += "'msg':'"+form.getForm().findField('editor').getValue()+"'";
           saveData += "}";
           console.log(saveData);
           //第一种提交方法，使用baseform的submit方法提交
           form.getForm().submit({
               url : pkuhrms.ContextRoot + '/pageFlows/test/submitFormPanel.do',//提交后的路径，相当于调用的action',
               params: {
                   saveData: saveData
               },
               success :function(form,action){
                   Ext.Msg.alert('信息',"保存成功");
               },
               failure : function(){
                   Ext.Msg.alert('错误',"操作失败")
               }
            });
        }
        
    //查询方法
    var querywb = function(){
        //获取查询条件
        var queryParam = form.getTopToolbar().getComponent('wenben').getValue();
        if(Ext.isEmpty(queryParam)){
            Ext.Msg.alert("请输入要查询的内容！");
            return;
        }
        console.log(form.getTopToolbar().getComponent('wenben').getValue());
        Ext.Msg.wait("正在查询...","提示");
        Ext.Ajax.request({
            url:pkuhrms.ContextRoot + '/pageFlows/test/queryFormPanel.do',
            params : {wenben : queryParam},
            success : function(response,options){
                Ext.MessageBox.hide();
                var json = Ext.decode(response.responseText);
                console.log(json);
                
                //赋值
                volutionOne(json);
                //给复选框赋值
                var myCheckgroup = form.getForm().findField('expResult');
                var checkResult = (json.rows[0].checked).split(',');
                if (json.rows.length > 0) {
                    for(var i = 0; i < checkResult.length; i++){
                        if(checkResult[i] === '1'){
                            myCheckgroup.items.items[0].setValue(true);
                        }
                        if(checkResult[i] === '2'){
                            myCheckgroup.items.items[1].setValue(true);
                        }
                        if(checkResult[i] === '3'){
                            myCheckgroup.items.items[2].setValue(true);
                        }
                    }
                }
                
                //给单选框赋值
                var myRadio = form.getForm().findField('radio');
                var radioResult = json.rows[0].radioed;
                if(radioResult === "1"){
                    myRadio.items.items[0].setValue(true);
                }
                if(radioResult === "2"){
                    myRadio.items.items[1].setValue(true);
                }
                console.info(checkResult);
                console.info(radioResult);
            },
            failure : function(response, options) {
                        Ext.MessageBox.hide();
                        Ext.Msg.alert("提示", "查询失败，请稍后重试！")
                    }
        });
    }
    var volutionOne = function(json){
        //设置查询出来的值
        form.getForm().findField('text').setValue(json.rows[0].wenben);
        form.getForm().findField('combo').setValue(json.rows[0].combo);
        form.getForm().findField('num').setValue(json.rows[0].num);
        form.getForm().findField('date').setValue(json.rows[0].cdate);
        form.getForm().findField('time').setValue(json.rows[0].ctime);
        form.getForm().findField('textarea').setValue(json.rows[0].area);
        form.getForm().findField('editor').setValue(json.rows[0].msg);
        form.getForm().findField('hidden').setValue(json.rows[0].id);
    }
});
运行效果图：


经过这两天的修正，这个formPanel总算能用了。。

下面说下与后台的交互实现思路：

第一：保存方法save()

看源码说话：

	var save = function(){
			var savedata;//用来存放获取的要保存的数据 
			var saveCheckresult = [];
			var inputValues = [];
			var checkresult = form.getForm().findField('expResult').getValue();//获取复选框的内容
			for (var i = 0; i< checkresult.length;i++){
				saveCheckresult.push(checkresult[i].vlaue);
				inputValues.push(checkresult[i].inputValue);
			}
			var radioresult = form.getForm().findField('radio').getValue();
			
		   saveData = "{'id':'"+form.getForm().findField('hidden').getValue()+"',";
		   saveData += "'wenben':'"+form.getForm().findField('text').getValue()+"',";
	  	   saveData += "'num':"+form.getForm().findField('num').getValue()+",";
		   saveData += "'cdate':'"+form.getForm().findField('date').getRawValue()+"',";
		   saveData += "'ctime':'"+form.getForm().findField('time').getValue()+"',";
		   saveData += "'combo':'"+form.getForm().findField('combo').getValue()+"',";
		   saveData += "'area':'"+form.getForm().findField('textarea').getRawValue()+"',";
		   saveData += "'checked':'"+inputValues+"',";
		   saveData += "'radioed':'"+form.getForm().findField('radio').getValue().value+"',";
		   saveData += "'msg':'"+form.getForm().findField('editor').getValue()+"'";
		   saveData += "}";
			console.log(saveData);
			//第一种提交方法，使用baseform的submit方法提交
			form.getForm().submit({
				url : pkuhrms.ContextRoot + '/pageFlows/test/submitFormPanel.do',//提交后的路径，相当于调用的action',
				params: {
        			saveData: saveData
    			},
				success :function(form,action){
					Ext.Msg.alert('信息',"保存成功");
				},
				failure : function(){
					Ext.Msg.alert('错误',"操作失败")
				}
			});
		}
大概思路如下：获取到表单的内容，自己拼接成一个json数组，然后使用form表单自带的submit方法，调用后台action，后台方法接收整个数组，用方法转换到model中，然后判断一下id是否为空，根据情况去调用insert语句还是update语句。。。

    这里麻烦一点的就是获取复选框的值时候，我在前台用的checkboxgroup组件，把选中的值用‘，’拼接成一个字符串，然后传到后台，在数据库里用一个字段去存放它。具体实现代码看上面.

获取值得方法：

form.getForm().findField('date').getRawValue();//
form.getForm().findField('text').getValue()
//拼接复选框的内容

var inputValues = [];var checkresult = form.getForm().findField('expResult').getValue();
//获取复选框的内容
for (var i = 0; i< checkresult.length;i++){
     inputValues.push(checkresult[i].inputValue);
}
console.info(inputValues);


 
第二：查询方法querywb() 

 

 

//查询方法
	var querywb = function(){
		//获取查询条件
		var queryParam = form.getTopToolbar().getComponent('wenben').getValue();
		if(Ext.isEmpty(queryParam)){
			Ext.Msg.alert("请输入要查询的内容！");
			return;
		}
		console.log(form.getTopToolbar().getComponent('wenben').getValue());
		Ext.Msg.wait("正在查询...","提示");
		Ext.Ajax.request({
			url:pkuhrms.ContextRoot + '/pageFlows/test/queryFormPanel.do',
			params : {wenben : queryParam},
			success : function(response,options){
				Ext.MessageBox.hide();
				var json = Ext.decode(response.responseText);
				console.log(json);
				
				//赋值
				volutionOne(json);
				//给复选框赋值
				var myCheckgroup = form.getForm().findField('expResult');
				var checkResult = (json.rows[0].checked).split(',');
				if (json.rows.length > 0) {
					for(var i = 0; i < checkResult.length; i++){
						if(checkResult[i] === '1'){
							myCheckgroup.items.items[0].setValue(true);
						}
						if(checkResult[i] === '2'){
							myCheckgroup.items.items[1].setValue(true);
						}
						if(checkResult[i] === '3'){
							myCheckgroup.items.items[2].setValue(true);
						}
					}
				}
				
				//给单选框赋值
				var myRadio = form.getForm().findField('radio');
				var radioResult = json.rows[0].radioed;
				if(radioResult === "1"){
					myRadio.items.items[0].setValue(true);
				}
				if(radioResult === "2"){
				    myRadio.items.items[1].setValue(true);
				}
				console.info(checkResult);
				console.info(radioResult);
			},
			failure : function(response, options) {
						Ext.MessageBox.hide();
						Ext.Msg.alert("提示", "查询失败，请稍后重试！")
					}
		});
	}
	var volutionOne = function(json){
		//设置查询出来的值
		form.getForm().findField('text').setValue(json.rows[0].wenben);
		form.getForm().findField('combo').setValue(json.rows[0].combo);
		form.getForm().findField('num').setValue(json.rows[0].num);
		form.getForm().findField('date').setValue(json.rows[0].cdate);
		form.getForm().findField('time').setValue(json.rows[0].ctime);
		form.getForm().findField('textarea').setValue(json.rows[0].area);
		form.getForm().findField('editor').setValue(json.rows[0].msg);
		form.getForm().findField('hidden').setValue(json.rows[0].id);
	}
 

 思路就不说了，太简单了，说说赋值需要注意的地方： 

 

因为复选框的值在后台是用的一个字段存放的，所以，从后台读取数据后要在前台进行解析分割，然后判断他的值决定复选框的勾选情况：
 

//给复选框赋值
				var myCheckgroup = form.getForm().findField('expResult');
				var checkResult = (json.rows[0].checked).split(',');
				if (json.rows.length > 0) {
					for(var i = 0; i < checkResult.length; i++){
						if(checkResult[i] === '1'){
							myCheckgroup.items.items[0].setValue(true);
						}
						if(checkResult[i] === '2'){
							myCheckgroup.items.items[1].setValue(true);
						}
						if(checkResult[i] === '3'){
							myCheckgroup.items.items[2].setValue(true);
						}
					}
				}
同理，单选按钮也是这种情况，不在赘述。 

 

用到的赋值方法：
 

form.getForm().findField('editor').setValue(json.rows[0].msg);
myCheckgroup.items.items[1].setValue(true);


 

 

 

 

 

好吧，今天整理到这里。还有一个自动加载查询下拉列表框的方法没实现。。。等我做完再说。
 

                

        

        

    




    

      

        

            

              
                
                  SamsonHeart
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                      0
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    0
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      

            

                专栏目录
          










                



	

		

			

				
					
extjs中的formPanel以及表单的应用

				
			

			

				

					05-28
				

			

		

		

			
				
FormPanel 是 ExtJS 中的一个核心组件，用于创建和处理表单元素，包括输入字段、按钮、选择框等。它提供了丰富的功能，如数据验证、远程提交、异步加载等，是构建用户交互界面的关键部分。  在ExtJS中，FormPanel是...

			
		

	



                

              
                



	

		

			

				
					
简单的两种Extjs formpanel加载数据的方式

				
			

			

				

					10-26
				

			

		

		

			
				
在ExtJS中，`Ext.form.Panel`（或简称为`formpanel`）是一种非常重要的组件，用于创建表单来收集用户输入的数据。本文将详细介绍两种在ExtJS formpanel中加载数据的方法，以供开发者参考。  ### 方法一：使用`...

			
		

	



                


  
              

                


	

		

			

				
					
第四章 介绍Extjs的formPanel (入门教程)

				
			

			

				

					czpae86x的专栏
				

				

					02-06
					
					251
					
				

			

		

		

			
				
第四章 介绍Extjs的formPanel (入门教程)
 
这章我们主要简单介绍一下Extjs的formPanel——formPanel的创建、formPanel字段数据的取得、xtype属性的使用、ComboBox的使用。
 
Extjs的formPanel分为两部分：
1，Ext.form.FormPanel ： 这个form我们可以理解为管表现的，就是呈现在界面我们看到的form...

			
		

	





	

		

			

				
					
extjs Ext.form.Panel 表单面板学习

					
最新发布

				
			

			

				

					西京刀客
				

				

					06-17
					
					1882
					
				

			

		

		

			
				
⭐️来自很多年前的extjs笔记，只是一个归档，不做更新！⭐️

			
		

	



		

			
		



	

		

			

				
					
ExtJs之FormPanel篇

				
			

			

				

					Kenshin Cui's Blog
				

				

					08-16
					
					6671
					
				

			

		

		

			
				
表单时是web中常见的元素，Ext中的表单也是特别丰富的，接下来我们一块看看表单的相关内容。
还是先看一下代码和效果：
Ext.onReady(function(){
    var fp=new Ext.form.FormPanel({ //注意：Ext.form.FormPanel=Ext.FormPanel
        title:'用户登录',
        width:300,
        //height:250,
        bodyStyle:'padding:5

			
		

	





	

		

			

				
					
ExtJs——FormPanel（布局）！！！

				
			

			

				

					binyao02123202的专栏
				

				

					02-21
					
					1617
					
				

			

		

		

			
				
FormPanel就两种布局方式：

    form——从上往下

    column——从左往右

注意落实到任何一个表单最后总是form布局。

 

 





[javascript] view
 plaincopyprint?






Ext.onReady(function(){  
    //行1  
    var r

			
		

	





	

		

			

				
					
Extjs之FormPanel布局

				
			

			

				

					idomyway的博客
				

				

					12-04
					
					2716
					
				

			

		

		

			
				
FormPanel有两种布局：form和column。 
form是纵向布局，column为横向布局。默认为后者。使用layout属性定义布局类型。对于一个复杂的布局表单，最重要的是正确分割，分割结果直接决定布局能否顺利实现。 
如果不再使用默认布局，那么我们必须为每一个元素指定一种布局方式，另外，还必须遵循以下几点：
落实到任何一个表单组件后，最后总是form布局
defaultType属性不一定

			
		

	





	

		

			

				
					
Extjs学习笔记之二 初识Extjs之Form

				
			

			

				

					10-29
				

			

		

		

			
				
在本篇Extjs学习笔记中，我们将深入探讨Extjs中的Form，特别是其封装的Ext.form.BasicForm和Ext.form.FormPanel。  首先，Extjs中的表单组件主要基于Ext.form.BasicForm，这是一个基础的表单对象，负责处理表单数据...

			
		

	





	

		

			

				
					
extJs中关于formPanel动态添加组件的验证问题

				
			

			

				

					04-13
				

			

		

		

			
				
EXT JS的官方文档和社区资源也提供了丰富的教程和示例，对于学习和解决实际问题非常有用。  总之，EXT JS FormPanel的动态添加组件和验证是一个复杂但重要的主题。通过理解EXT JS的API和验证机制，结合源码分析和...

			
		

	





	

		

			

				
					
ExtJs中表单formPanel的横向布局

				
			

			

				

					05-30
				

			

		

		

			
				
ExtJs中表单formPanel的横向布局

			
		

	





	

		

			

				
					
ExtJs formPanel(一、基础)

				
			

			

				

					WEBCODE
				

				

					07-29
					
					125
					
				

			

		

		

			
				

转自:http://witcheryne.iteye.com/blog/335577

Extjs的formPanel分为两部分：

1，Ext.form.FormPanel ： 这个form我们可以理解为管表现的，就是呈现在界面我们看到的form。

2，Ext.form.BasicForm ： 这是管数据的，例如form操作数据一般使用它。





Extjs的f...

			
		

	





	

		

			

				
					
Extjs取得FormPanel某个控件并赋值

				
			

			

				

					evilcry2012的专栏
				

				

					05-05
					
					7354
					
				

			

		

		

			
				
Extjs取得某个控件并赋值


2013-09-27 09:55 5797人阅读 评论(2) 收藏 举报



 分类：
 

Ext（3） 



版权声明：本文为博主原创文章，未经博主允许不得转载。



在开发的很多时候,在调用另一个弹出页面或修改完一个内容后,需及时地反应出来,就这需要在修改后及时的给原有的框框赋值... 
实际操作也是很简单,如: 

			
		

	





	

		

			

				
					
extjs表单FormPanel提交数据和加载数据

					
热门推荐

				
			

			

				

					southcamel的专栏
				

				

					05-12
					
					1万+
					
				

			

		

		

			
				
FormPanel数据提交和加载的方法
1.FormPanel数据提交包括两种方式，一种是使用BasicForm的submit方式进行ajax的异步提交，另一种是使用原始的HTML表单的提交方式
    1.1BasicForm的submit方式进行ajax的异步提交
var form = new Ext.form.FormPanel({
		frame : true ,
		default

			
		

	





	

		

			

				
					
extjs4 formpanel 表单布局

				
			

			

				

					为梦想放生,创造梦一样的未来！
				

				

					11-30
					
					4833
					
				

			

		

		

			
				
/************* form layout ********************/

var field8 = Ext.create('Ext.form.field.Date', {
    fieldLabel: '开始日期*',
    name: 'field8',
    format: 'Y-m-d',
    anchor: '96%',
    value: '2015

			
		

	





	

		

			

				
					
第八讲：ExtJS组件之FormPanel(上)

				
			

			

				

					xiaozhengN的博客
				

				

					11-25
					
					875
					
				

			

		

		

			
				
示例一：最简单的FormPanel示例。


			Ext.onReady(function(){

			var form = new Ext.FormPanel({

			renderTo:"form",

			title:"表单Panel",

			width:300,

			height:300,

			frame:true,

			items:[

			new Ext.fo...

			
		

	





	

		

			

				
					
ExtJs formPanel(二、表单提交和取值)

				
			

			

				

					WEBCODE
				

				

					07-29
					
					193
					
				

			

		

		

			
				
在Ext中FormPanel并中并不保存表单数据，其中的数据是由BasicForm保存，在提交表单的时候需要获取当前FormPanel中的BasicForm来进行提交.
在获取BasicForm对象后便可进行表单的提交操作...
 此时需要查一下BasicForm 的API文档，
1.首先取值可以通过findField方法来寻找name,等还可以使用其它方法

simple.getFor...

			
		

	





	

		

			

				
					
ExtJs2.0学习系列教程概述

				
			

			

				

					
				

			

		

		

			
				
"此文档是关于ExtJs入门的学习系列，主要涵盖了从基础组件到高级应用的多个实例，包括Ext.MessageBox、Ext.Panel、Ext.Window、Ext.FormPanel、Ext.TabPanel以及Ext.TreePanel的使用。作者旨在帮助初学者理解和掌握...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值