ExtJS重置

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ExtJS重置相关的知识,希望对你有一定的参考价值。

在一个页面里有多个可输入项,如何做到设置一个按钮,按下去重置所有的输入项 ,我试了reset(),他只能重置第一个ID的字段,再往后的就没法重置了,也试了reload,这个直接刷新页面也不是我想要的,求问我该如何才能做到一次重置所有

按理说reset是可以的,但是只是部分可以的。
如果想不刷新做到重置,最最保险的方法,就是自己做赋值!
一个按钮,添加click事件,然后在里面把所有表单元素或者全局变量,赋值成初始值,这个虽然在编程上麻烦,但是可以解决一切可能出现的问题。像表单里有combox,radiogroup,fileupload,包括更为复杂的控件comboTree等等,有些只是单纯的reset是解决不了重置的。
所以,个人还是建议,多些开发量,少些bug烦恼,而这开发量也是纯体力活儿,心情好时复制粘贴,一会儿就搞定了!
参考技术A var form = Ext.create("Ext.form.Panel", 
    items: [
        //表单组件1
    ,
        //表单组件2
    ,
        //表单组件3
    , 
        //表单组件4
    ]
);

//不管这个form里面有多少个表单组件,只要保证在该formpanel下都会被重置,我在实际项目中使用过,是没问题的

form.getForm().reset();

Extjs 重置文件字段输入

【中文标题】Extjs 重置文件字段输入【英文标题】:Extjs reset filefield input 【发布时间】:2012-06-22 13:17:28 【问题描述】:

如何在 ExtJS 中重置文件字段输入?我正在尝试:

//this - point on Ext.panel.Form

var form = this.getForm();
form.reset();

var filefield = this.getForm().getFields().get(0);
filefield.reset();

filefield.setValue('');

filefield.value = '';

但这些方法中没有一种是行不通的。谢谢你的帮助!

【问题讨论】:

【参考方案1】:

使用下面的代码会帮助你

function clearFileUpload(id)
    // get the file upload element
    fileField     = document.getElementById(id);
    // get the file upload parent element
    parentNod     = fileField.parentNode;
    // create new element
    tmpForm        = document.createElement("form");
    parentNod.replaceChild(tmpForm,fileField);
    tmpForm.appendChild(fileField);
    tmpForm.reset();
    parentNod.replaceChild(fileField,tmpForm);

【讨论】:

【参考方案2】:

旧帖子,但我也遇到了这个问题,我找到了一个更清洁的解决方案。

首先确保文件字段设置了allowBlank: true。

然后你可以这样调用 setRawValue 方法:

    filefield.setRawValue("");

【讨论】:

【参考方案3】:

您可能正在寻找的最简单的方法是:

filefield.fileInputEl.dom.value = '';

【讨论】:

【参考方案4】:

基于这个答案:HTML input file selection event not firing upon selecting the same file

在 Ext.ux.form.FileUploadField 组件的 bindListeners 函数下的 change 事件中添加如下代码。

var that = this;
setTimeout(function() 
    that.fileInput.dom.value = null;
    that.setValue(that.fileInput.dom.value);
, 100);      

bindListeners: function()
  this.fileInput.on(
    scope: this,
    mouseenter: function() 
      this.button.addClass(['x-btn-over','x-btn-focus'])
    ,
    mouseleave: function()
      this.button.removeClass(['x-btn-over','x-btn-focus','x-btn-click'])
    ,
    mousedown: function()
      this.button.addClass('x-btn-click')
    ,
    mouseup: function()
      this.button.removeClass(['x-btn-over','x-btn-focus','x-btn-click'])
    ,
    change: function()
      var v = this.fileInput.dom.value;
      this.setValue(v);
      this.fireEvent('fileselected', this, v);

      var that = this;
      setTimeout(function() 
        that.fileInput.dom.value = null;
        that.setValue(that.fileInput.dom.value);
      , 100);
    
  ); 
,

【讨论】:

以上是关于ExtJS重置的主要内容,如果未能解决你的问题,请参考以下文章

ExtJS 存储/网格重置

ExtJS:当我点击展开时,Widget Combo重置所有字段的值

自动填充组合框 ExtJS

Ext JS 组合框值在模糊后重置为错误值

任意用户密码重置:重置凭证可暴破

任意用户密码重置:重置凭证未校验