`
angelbill3
  • 浏览: 253488 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

ExtJS之表单篇(formpanel) 学习总结

 
阅读更多
1、根据值Value改变gridpanel单元格字体颜色
(通过ColumnModel控件的renderer属性)
renderer : function(value) {
	if (value == '0')
		return '正常';
	else if (value == '1')
		return "<span style='color:red;'>注销</span>";
}

参考:http://blog.sina.com.cn/s/blog_647a022e01016ilj.html

2、FORM表单设值
data的值JSON格式为:{"in":"iamin","out":"iamout"}
其中id中的in\out为form表单中的fieldtext id
qForm.getForm().setValues([
    {id:'in',value:data.in},
    {id:'out',value:data.out}    	  
]);


3、将一个文本框改成金额格式,并校验。
在onReady中定义新的vtype:
Ext.onReady(function(){
	//输入框为金额时重新定义
	Ext.apply(Ext.form.VTypes, {
	    money: function (val) {
	        return /^([1-9]\d{0,7}|0)(\.\d{1,2})?$/.test(val);
	    },
	    moneyText: '请输入正确的金额'
	});
});

EXT布局中的文本框新增vtype:
{fieldLabel:'金额',vtype:'money',name:'amount',allowBlank : false}


4、在表单B提交时,顺带将表单A中的参数也提交。
在表单B提交时方法中写:
var otherParams =formA.getForm().getValues(true);
formB.form.submit({
	url:'***',
	method:'POST',
	params : otherParams,
	success:function(form,res){
		alert("success");
	},
	failure:function(form,res){
		alert("fail");	
	}
});
分享到:
评论

相关推荐

    ExtJs中表单formPanel的横向布局

    ExtJs中表单formPanel的横向布局

    ExtJS的表单

    ExtJS的表单使用FormPanel容器 表单使用的布局方式:form和formtable布局 ExtJS的表单和html的form标签是相似的,新建一个FormPanel实际上就是新建一个html的form标签,只是添加许多Ext的样式而已

    extjs中的formPanel以及表单的应用

    NULL 博文链接:https://zxf-noimp.iteye.com/blog/634692

    Extjs4的FormPanel从后台load json数据的要点

    Extjs4 表单从数据库读取数据映射到对应的字段中显示

    ExtJs4.0 表单提交Demo

    一个简单的ExtJs4.0搭建环境,利用Ext Ajax的方式提交表单,可使得显示层和控制层完全分开.

    extjs form textfield的隐藏方法

    this.formpanel = new Ext.FormPanel({ items: [{ fieldLabel: ‘代码’, name: ‘FCode’, anchor:’100%’, id: ‘fid’ },{ fieldLabel: ‘名称’, name: ‘FName’, anchor:’100%’ // anchor width by ...

    轻松搞定Extjs_原创

    一、开始组件学习之旅 53 二、被设计得面目全非的按钮 53 三、日期选择器Ext.DatePicker 55 四、小结 56 第十章:数据与ComboBox 57 一、数据在这里是动词 57 二、Ext.data.DataProxy类 57 三、Ext.data.DataReader...

    ExtJS4如何给同一个formpanel不同的url

    主要介绍了ExtJS4如何给同一个formpanel不同的url,需要的朋友可以参考下

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

    Extjs中的表单组件是Ext.form.BasicForm,不过最简单最常用的是Ext.form.FormPanel控件,它继承自Panel,具有一定的界面显示控制能力,它其中包含着一个BasicForm对象,用来执行向服务器提交,加载等动作。Extjs也对...

    深入浅出ExtJS第2版

    深入浅出ExtJS第2版+源码..1 下载EXT发布包 1 1.2 如何查看EXT自带的API和示例 1 1.3 为什么有些示例必须放在服务器上 才能看到效果 2 1.4 Hello World 2 1.4.1 直接使用下载的发布包 2 1.4.2 在项目中使用EXT...

    extjs中验证实例

    title:"学习表单字段元素的字段集", width:600, height:400, frame:true, renderTo:"myForm", items:[ {xtype:"fieldset", width:500, labelAlign:"right", labelWidth:70, title:"个人信息" , ...

    Extjs中常用表单介绍与应用

    目标: 知道表单面板如何创建 了解表单面板中xtype的类型的应用 知道表单面板如何验证,绑定,取值 综合应用表单面板(玩转它) 内容: 首先我们要理解的是FormPanel也是继承panel组件的。所以它有着panel的属性 要...

    extjs增删改查典型案例

    userForm = new Ext.FormPanel({ id:'conditionForm', labelWidth:'80', labelAlign:'right', border:false, bodyBorder:false, frame:true, items:[ layout:'column', items:[ { columnWidth:'.8', ...

    Extjs优化(二)Form表单提交通用实现

    代码如下: /** * 提交表单 */ function $postForm(a) { if (a.formPanel.getForm().isValid()) { var b = a.scope ? a.scope: this; a.formPanel.getForm().submit({ scope: b, url: a.url, method: “post”, ...

    Extjs 4.x 得到form CheckBox 复选框的值

    CheckBox(复选框)主要用来接收用户选择的选项 如图所示(请忽略UI的不好看): 该弹出窗口的主要代码如下: ... 具体定义如下: 代码如下: var fp = Ext.create(‘Ext.FormPanel’, { frame: true, fieldDefaults: {

    ext几个实例

    本篇是关于Ext.Ajax + Ext.FormPanel + MySQL数据库的完整登录案例,一个是html的form表单,一个是Ext的FormPanel表单,在提交或结合Ext.Ajax多少还是有区别的.

Global site tag (gtag.js) - Google Analytics