ExtJs如何判断form表单是否被修改过详解

1.Extjs表单提交主要有三种方式:

1, EXT的form表单ajax提交(默认提交方式) 
     相对单独的ajax提交来说优点在于能省略写参数数组 ,form.getForm().submit

3、EXT的ajax提交,Ext.Ajax.request

2、EXT表单的非ajax提交

在我看来:采用第1,2种都很方便,关键是Ext.Ajax.request传递给后台是一个字符串形式的,需要Jason解析

2.记录代码问题:

 1 SaveStudentDetails:function(btn,event){
 2         var form = Ext.getCmp(‘StudentDetailsForm‘);
 3         var formValues = form.getValues();
 4         var userstore = this.getStore(‘StudentList‘);
 5         if(form.getForm().isDirty()==false){
 6             Ext.MessageBox.alert(‘提示‘,‘您没有修改或新增任何资料‘);
 7             return;
 8         }
 9         form.getForm().submit({
10             clientValidation: true,
11                url: ‘updateInf.action‘,
12             params: {
13                 newStatus: ‘delivered‘
14                 },
15                 success : function(form2, action){
16                     Ext.Msg.alert(‘更新提示‘ , action.result.msg) ;
17                     userstore.load();
18                     btn.up(‘window‘).close();
19                     console.log(form);
20                    console.log(form2);
21                     //form.up(‘window[id=StudentDetailsWindow]‘).close();
22                     //form.up(‘window‘).close();
23                 },
24                 failure : function(form , action){
25                     switch(action.failureType){
26                         case Ext.form.action.Action.CLIENT_INVALID :
27                             Ext.Msg.alert(‘修改失败‘, ‘表单填写错误,输入无效值或没填完‘);
28                             break ;
29                         case Ext.form.action.Action.CONNECT_FAILURE :
30                             Ext.Msg.alert(‘修改失败‘, ‘表单填写错误,输入无效值或没填完‘);
31                             break ;
32                         case Ext.form.action.Action.SERVER_INVALID :
33                             Ext.Msg.alert(‘更新提示‘, action.result.msg);
34                     }
35                 }
36         });
37     },    

 问题1:ExtJs如何判断form表单是否被修改过?怎样让Form表单修改才能提交?

看代码5-8,这里使用isDirty()判断,实现效果图如图所示:

但是这里有个问题,就是这个form的字段是loadRecord来的,

var form = win.down(‘form‘).getForm(); 
form.loadRecord(record);

所以无论怎样,这里的form.isDirty总是true,因为form只要load就意味着它的值被改变了,所以在view层的form里要加上一句话:trackResetOnLoad:true,

参考资料:http://doc.okbase.net/wangs7345/archive/111076.html

trackResetOnLoad是在form表单load数据的时候是否记录字段原始值的开关。 在setVlaues中会根据这个开关进行判断,如果为true就记录这个数据。 

如果为trackResetOnLoad:true,,则表单对象的form.reset()方法重置到最后一次加载的数据或setValues()数据,以相对于一开始创建表单那时的数据。  

 问题2:怎样使得Form值修改之后的值立即展示

  代码行17,把它的store重新load了一下

问题3:怎样使修改之后窗口就关闭

  代码行18-22,这里的Window可以通过btn和Window里面的form找到

  但是有个问题,为什么success里面的form是form2,因为要操作的form和success里面的form不是一个,success里面的form是form.Basic里面的,不是这里关闭的form

  所以这里的window可以通过3种方式找到

  btn.up(‘window‘).close();
  form.up(‘window[id=StudentDetailsWindow]‘).close();
  form.up(‘window‘).close(); 

问题4:Extjs什么时候用getForm(),什么时候不用getForm()  查看api,当说到BasicForm的时候就getForm  当使用一个方法时候,如果这个form.panel里面有就可以直接使用,如果没有,就查Ext.Basic ,这个时候用到的就是Basic类型的,就要getForm

  
时间: 2024-10-25 00:36:17

ExtJs如何判断form表单是否被修改过详解的相关文章

Html5之高级-2 HTML5表单属性(属性介绍、属性详解)

一.属性介绍 属性介绍 - 有一些输入类型要求使用特定的属性才能显示效果,如前面提到过min,max,step. 其他输入类型需要使用一些属性来改进其他性能,或者决定验证过程的重要性.HTML5 标准中再原来的基础上增加了一些新的属性. - Placeholder 属性 - Nultiple 属性 - Autofocus 属性 - Form 属性 二.属性详解 Placeholder 属性 - Placeholder 属性通常用于search输入类型,也可以用在文本域.它表示一个简单提示.单词或

JQuery判断form表单是否为空

功能:通过jquery判断form表单中是否有内容还未填写,如果有未填写的,则阻止提交 $(function () { $('form').bind('submit',function () {  //给form标签绑定submit事件 var i=0; $("input").each(function(){  //遍历input标签,判断是否有内容未填写 var vl=$(this).val(); if(vl==""){ i=1; } }); var t=$('t

[extjs] ExtJs4.2 Form 表单提交

基本代码: <script> Ext.onReady(function(){ Ext.create('Ext.form.Panel', { title: '登录', bodyPadding: 5, width: 350, // 将会通过 AJAX 请求提交到此URL url: '${pageContext.request.contextPath}/back/login.do', // 表单域 Fields 将被竖直排列, 占满整个宽度 frame: true, layout:'auto', /

判断form表单每个input字段是否有内容

//input失去焦点时判断是否有值 若没有 则不能点击保存 function Input_verification() {//input的内容 var input_val = null; //是否能够点击保存 var canClick = false; this.init = function (fo, btn) { //input列表 fo.input = []; //表单下的input var input_text = fo.find('input[type="text"]');

jQuery判断 form表单提交时如果表单里有input标签为空那么不提交form表单

<head> <script type="text/javascript"> $("#sub1").click(function(){ var text1=$("#text1").val(); if(text1==""){ alert("不能为空!"); $("#text1").select(); $("#text1").focus(); }e

Extjs的form表单自动装载数据(通过Ext.data.Model的代理加载数据)

在做项目的时候遇到一个问题,以前双击grid页面一行数据的时候,会吧双击这一行的数据自动加载到双击的页面(Ext的弹出框),可以通过this.down(''form).getForm().loadRecord(record)来自动加载,可是现在有一个需求就是双击grid一行弹出一个新的浏览器页面(不是ext的弹出框,通过window.open()实现),只能把双击的id传到页面,再重新查数据手动赋值,如果一个页面字段很多,一个一个赋值是很辛苦的,所以就想能不能自动装载数据 通过长时间研究发现,t

extjs中form表单提交成功、失败的响应信息

类Ext.form.Action.Submit 处理表单Form数据和返回的response对象的类. 该类的实例仅在表单Form{@link Ext.form.BasicForm#submit 提交}的时候创建. 返回的数据包必须包含一个 boolean 类型的success属性,还有可选地,一个含有无效字段的错误信息的属性 A response packet may contain: ·        success property : Boolean - required. ·     

Extjs form 表单的 submit

说明:extjs form表单的提交方式是多种多样的,本文只是介绍其中的一种方法,本文介绍的方法可能不是完美的,但是对于一般的应用应该是没有问题的.     本文包括的主要内容有:form面板设计.form字段值的获取.后台处理代码以及返回数据的获取 1.form表单设计 var panelItem = Ext.create('Ext.form.Panel', { border: false, id:'formMain', layout: 'form', items: [ { xtype: 'f

HTML table、form表单标签的介绍

本篇主要介绍 table.form标签以及表单提交方式. 目录 1. <table> 标签:在HTML 中定义表格布局. 2. <form> 标签:用于创建 HTML 表单. 3. 表单提交方式:介绍get.post方法. 1. <table> 标签 1.1 说明 在HTML 中定义表格布局. 1.2格式 <table> <caption></caption> <tr> <th></th></