首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在Ext JS中为submit事件获取颗粒字段的验证?

在Ext JS中,可以通过使用表单的getForm()方法来获取表单对象,然后使用表单对象的isValid()方法来验证表单字段的有效性。在submit事件中,可以通过监听事件的回调函数中使用这些方法来获取和验证表单字段。

以下是一个示例代码:

代码语言:javascript
复制
Ext.create('Ext.form.Panel', {
    title: 'My Form',
    items: [{
        xtype: 'textfield',
        fieldLabel: 'Name',
        name: 'name',
        allowBlank: false
    }, {
        xtype: 'textfield',
        fieldLabel: 'Email',
        name: 'email',
        vtype: 'email'
    }],
    buttons: [{
        text: 'Submit',
        handler: function() {
            var form = this.up('form').getForm();
            if (form.isValid()) {
                // 表单字段验证通过,可以进行提交操作
                form.submit({
                    url: 'submit.php',
                    success: function(form, action) {
                        Ext.Msg.alert('Success', action.result.msg);
                    },
                    failure: function(form, action) {
                        Ext.Msg.alert('Failed', action.result.msg);
                    }
                });
            }
        }
    }],
    renderTo: Ext.getBody()
});

在上述代码中,我们创建了一个表单面板,并添加了两个文本字段。其中,Name字段设置了allowBlank: false,表示该字段不能为空;Email字段设置了vtype: 'email',表示该字段必须符合邮箱格式。

在提交按钮的点击事件处理函数中,我们首先通过this.up('form').getForm()获取到表单对象,然后使用isValid()方法验证表单字段的有效性。如果验证通过,则调用submit()方法提交表单数据。

需要注意的是,上述代码中的提交操作是一个示例,实际情况中需要根据具体需求来修改提交的URL和处理成功/失败的回调函数。

推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云云数据库MySQL。您可以通过以下链接了解更多信息:

相关搜索:如何在验证消息前面的验证摘要中获取错误字段的 ID如何在antd中为FormItem获取更改后的字段值当SpringBoot中的字段验证失败时如何在ConstraintViolationException中获取RequestParam名称如何在更新输入字段时隐藏React Js中的验证错误?如何在swift中获取带URL的JS事件处理程序如何在Graal-JS中从java中获取js对象的字段和调用方法?如何在JS或Jquery中为新创建的按钮添加onclick事件?如何在Laravel模型中为带有大写字母的字段设置或获取属性?如何在fetch中获取状态码为400 react js的响应数据在wordpress中,我为当前通过身份验证的用户获取了错误的自定义字段值如何在Vuetify.js的快捷栏中显示文本字段验证检查结果?如何在html中获取用户输入并将其设置为js中的变量?如何在nuxt中为其他外部js函数获取作用域中的外部js文件函数?从Node.JS后端移动服务中的身份验证令牌获取用户信息,如姓名、电子邮件Id等如何在Vue.js中为两个事件调用一次相同的方法?如何在不使用事件侦听器的情况下从Firestore文档中获取单个字段?如何在js public/uploads/image中获取质量为百分比的图片如何在node js中使用formidable模块从html字段中获取输入类型的文本数据?如何在行数据绑定事件中获取单元格的值?以及如何检查单元格是否为空?如何在节点js中使用tronweb无限制地获取tron网络中合同的所有事件日志?
相关搜索:
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

ExtJs二(实现登录)

如果想要在脚本中使用ExtJS提示信息,可将书附带资源包Ext.js文件复制到ExtJS目录,复制后,在解决方案资源管理器将Ext.js拖到到login.js文件,就会生成以下代码:  //...,标签宽度80,标签分隔符中文冒号,锚固为0,都不允许空等,代码如下: defaultType: "textfield", fieldDefaults: { labelWidth: 80...没关系,在4.1版本Ext JS,修改了事件定义方式,可以直接对象生成HTML元素绑定事件了,只要在监听事件中加入element配置项就行了,这相当方法。...代码,element配置项el就表示要在对象生成HTML元素绑定事件,绑定事件click事件事件将调用onRefrehImage方法。...{ me.form.items.items[0].focus(true, 10); } me.onRefrehImage(); } 代码要注意获取表单第一个文本字段代码

1.9K20

ExtJs二(实现登录)

如果想要在脚本中使用ExtJS提示信息,可将书附带资源包Ext.js文件复制到ExtJS目录,复制后,在解决方案资源管理器将Ext.js拖到到login.js文件,就会生成以下代码:  //...,标签宽度80,标签分隔符中文冒号,锚固为0,都不允许空等,代码如下: defaultType: "textfield", fieldDefaults: { labelWidth: 80...没关系,在4.1版本Ext JS,修改了事件定义方式,可以直接对象生成HTML元素绑定事件了,只要在监听事件中加入element配置项就行了,这相当方法。...代码,element配置项el就表示要在对象生成HTML元素绑定事件,绑定事件click事件事件将调用onRefrehImage方法。...{ me.form.items.items[0].focus(true, 10); } me.onRefrehImage(); } 代码要注意获取表单第一个文本字段代码

2.1K10
  • 何在MySQL获取某个字段最大值和倒数第二条整条数据?

    在MySQL,我们经常需要操作数据库数据。有时我们需要获取倒数第二个记录。这个需求看似简单,但是如果不知道正确SQL查询语句,可能会浪费很多时间。...在本篇文章,我们将探讨如何使用MySQL查询获取倒数第二个记录。 一、查询倒数第二个记录 MySQL中有多种方式来查询倒数第二个记录,下面我们将介绍三种使用最广泛方法。...二、下面大家提供一个测试案例 我们来看一个例子,假设我们有一个名为users表,其中包含以下字段: CREATE TABLE users ( id INT(11) NOT NULL AUTO_INCREMENT...------+-----+ | id | name | age | +----+------+-----+ | 4 | Lily | 24 | +----+------+-----+ 三、查询某个字段最大值整条数据...SELECT * FROM commodity ORDER BY price ASC LIMIT 1; 结论 在MySQL获取倒数第二条记录有多种方法。

    1.2K10

    ExtJs四(ExtJs MVC登录窗口调试)

    'Ext.ux': 'scripts/extjs/ux' } }); 代码,enabledtrue,表示开启动态加载,paths对象里面定义就是加载路径,在这里定义了Ext扩展加载路径...完成后代码如下: [HttpPost] public JObject Login(LoginModel model) { return View(); } 因为Ext JS需要数据格式基本是固定...代码通过遍历ModelState不能通过验证字段,将其加入到errors对象。...这里有个问题一定要注意,模型字段名称必须与定义表单时字段name名称一致,不然后台字段与前台字段就对应不上了。  ...如果验证成功,返回successtrue,则表示登录成功了。 然后对login.js登录事件添加提示信息,登录成功的话,弹出登录成功提示框,失败的话,弹出登录失败提示框。

    4.4K20

    ExtJs四(ExtJs MVC登录窗口调试)

    'Ext.ux': 'scripts/extjs/ux' } }); 代码,enabledtrue,表示开启动态加载,paths对象里面定义就是加载路径,在这里定义了Ext扩展加载路径...完成后代码如下: [HttpPost] public JObject Login(LoginModel model) { return View(); } 因为Ext JS需要数据格式基本是固定...代码通过遍历ModelState不能通过验证字段,将其加入到errors对象。...这里有个问题一定要注意,模型字段名称必须与定义表单时字段name名称一致,不然后台字段与前台字段就对应不上了。  ...如果验证成功,返回successtrue,则表示登录成功了。 然后对login.js登录事件添加提示信息,登录成功的话,弹出登录成功提示框,失败的话,弹出登录失败提示框。

    2.6K40

    EXT.NET复杂布局(一)——工作台

    使用EXT.NET就不代表不需要写EXTJS,更不代表不需要了解Extjs。你会发现,在使用EXT.NET过程,也会对Extjs有一定了解。...当服务器控件放在用户控件或者母版页里面时,注意使用服务器标记来获取客户端ID。 toExcuteOperations:封装在另外JS文件里,用于处理每项事务,由于代码量多,就不贴出来了。...有的控件设置了IDMode="Static",故可以直接使用控件服务器ID来获取对象。 ExcuteCommand:执行命令。当View时,打开相应窗口。...这里是当overtimeflag1时,该行该列数据加粗变红。...在Handler属性里面写脚本,可以使用"#{ID}"来获取控件客户端ID, 这里没有设置IDMode="Static",所以当放置在用户控件或者母版页时候,会添加很多前缀,导致JS执行出错。

    2.3K30

    从入门到冠军 中国移动人群画像赛TOP1经验分享

    字段说明如下: 字段列表 字段说明 用户编码 数值 唯一性 用户实名制是否通过核实 1是0否 用户年龄 数值 是否大学生客户 1是0否 是否黑名单客户 1是0否 是否4G不健康客户...但是大部分特征存在类拖尾情况,当月旅游资讯类应用使用次数特征max87681次,明显偏离mean约为19次数,后续我们将会对这些特征单独分析。...结论二:通常一个人信用分发展规律是获得基础分,随着时间推移,会有加分事件,和减分事件发生。伴随着这些事件,信用分逐步上涨或降低。但是对于赛题本身,绝大部份特征属于正面特征。...,在进行中级探索时候应该结合模型进行线下稳定验证测试,在一些结构化竞赛通过大量中级探索就能够在竞赛中进入10%。...] = 0submit.loc[il_ext, 'score'] = (submit[il_ext]['score1'] * l1_ext_rate + submit[il_ext]['score2']

    1.6K40

    从入门到冠军 中国移动人群画像赛TOP1经验分享

    字段说明如下:字段列表 字段说明用户编码 数值 唯一性用户实名制是否通过核实 1是0否用户年龄 数值是否大学生客户 1是0否是否黑名单客户 1是0否是否4G不健康客户 1是0...但是大部分特征存在类拖尾情况,当月旅游资讯类应用使用次数特征max87681次,明显偏离mean约为19次数,后续我们将会对这些特征单独分析。...结论二:通常一个人信用分发展规律是获得基础分,随着时间推移,会有加分事件,和减分事件发生。伴随着这些事件,信用分逐步上涨或降低。但是对于赛题本身,绝大部份特征属于正面特征。...,在进行中级探索时候应该结合模型进行线下稳定验证测试,在一些结构化竞赛通过大量中级探索就能够在竞赛中进入10%。...] = 0submit.loc[il_ext, 'score'] = (submit[il_ext]['score1'] * l1_ext_rate + submit[il_ext]['score2']

    1.4K20

    Extjs form 组件

    1.根类 Ext.form.Basic 提供了,表单组件,字段管理,数据验证,表单提交,数据加载功能 2.表单容器 Ext.form.Panel 容器自动关联 Ext.form.Basic 实例对象更方便进行字段配置...  文本框方式 Ext.form.field.Trigger 触发器 Ext.form.field.Time  带有时间下拉框 和自动验证input表单。...Validations 内置校验   Ext.data.validations     本单例包含一个验证函数集合, 用以验证任何类型数据。...FieldinvalidText,任何’{0}’ 都会被替换成这个字段值,’ {1}’会被替换成这个字段format,下面的代码展示了如何使用这个特性自定义错误信息     自定义校验:       ...提交之前调用了isValid方法确保每个表单字段都已经填写正确    3.最后调用submit方法,并传递了两个回调函数success和failure,在这两个回调函数参数,action.result

    2K50

    Django项目于之在线教育平台网站实战开发(完结)

    name属性值,直接做回显,并没有做任何加密处理,当黑客将请求地址name属性值修改成一段js脚本,比如下图所示获取cookie并进行alert打印,那么就会获取到用户保存在本地cookie...进行解压后,替换编辑器源码font-awesome目录文件 在xadmin后端页面左侧导航栏,修改用户心下邮箱验证码图标 在xadmin源码auth.py模块中找到UserAdmin模型类图标属性变量...,如下图所示 然后紧接着在EmailVerifyRecordAdmin邮箱验证码注册类执行model_icon属性上图样式 Ctrl+F5强制刷新xadmin后台,用户信息邮箱验证图标就修改成功了...在课程数据点击数丶收藏认识丶学习人数应该是只读而不能进行修改编辑 在注册类添加readonly_fields属性指向要只读字段 readonly_fields = ['students',...使用 在xadmin后台管理课程添加章节信息时,不能在增加课程页面直接添加,而是需要退出课程到章节字段中去选择课程后才能添加课程章节信息,在xadmin也能像django admin那样去做到在一个页面直接添加外键信息

    1.2K30

    jQuery.validationEngine.js学习

    validate字符串类,且不是checkbox,radio或者是类datepicker(时间控件)元素将拥有blur事件 //checkbox,radio必须要有validate控件绑定click...data-validation-engine-skip属性a标签和button,input标签,类拥有validate-skip字段a标签和button,input标签绑定click事件。..._onSubmitEvent);//绑定submit return this; } 绑定了基本上控件触发事件,这里还要提到是在我们提交form时候,会触发插件内容submit监听事件,实际上插件会在你提交之前再去帮你检查一遍控件...其实这个插件将控件需要执行验证规则都写在了class类,也就是说我们在validate[]写了一些规则,那么控件将会执行这些规则,其实required则表示必填,email则表示输入email...将错误内容放入div,将生成div插在被触发控件前面,并且为div加上class,为什么加,在init方法,我们已经这类class添加了click事件,功能是点击能够删除它们。

    4K20

    对HTML-input一些思考和理解

    ★上面这段CSS代码意思:将边框阴影设为白色,然后向内扩展,覆盖原来应该显示“黄色”。 ” HTML5约束验证 HTML5对于input增加了很多标签属性,和事件。...,无则返回false validity:当前元素验证状态 validationMessage:描述相关约束失败 / 错误信息 checkValidity():有没有满足任一约束(常被用在submit事件...) setCustomValidity():设置自定义验证提示信息 里面还有许多属性都是和input属性(字段)一一对应: validitestate对象属性 input属性字段 valueMissing...“数字精确规范”:step="0.01",则最后可获取到两位小数(否则number默认只能获取整数值) input还有一个比较“特别”:search。...事件监听:如果提交时验证不通过 form.addEventListener("submit",function(e){ if(!

    66230

    Vue核心api和组件开发实践

    派发事件 总线模式 项目的main.js,也就是在vue初始化时,设置一个新"bus"方法。...此需求业务逻辑是:子组件传参成功后,需要通知父组件一个消息,父组件需要判断来决定是否添加(购物车空,允许购买,购物车本商品已经达到上限,不让购买) 还是派发事件。...传参模式选择: 子传父,最好就是派发事件。 父传子当然用props 规模较大时使用Vuex是最好解决方案。 ---- 3. 其它api 动态样式 需求描述:取消勾选一个商品。设置样式灰底。...用意何在? 思考如下问题: el-form-item如何知道校验规则?表单全局校验是如何实现 value绑定,input事件 设计form组件 接下来回到增加列表表单,继续造轮子。...它 是一个异步验证库,需要传入要验证数据和验证规则 官方链接 https://github.com/yiminghe/async-validator 你可以定义一个条件来对字段进行校验

    2K20
    领券