获取表单中的参数数据集并查询-优快云博客

本文介绍了一种从表单获取数据并将其传递给后台的方法，通过使用JavaScript实现了表单参数的收集与处理。此外，还提供了一个更新Grid数据的实用函数，包括清空列表及重新加载数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在项目中某些模块进行查询时，可以通过form.findField('xxx');的方式一一获得表单参数，然后传递到后台进行查询。

我们可以通过如下的方式获取，只需要调用prepareParamsFromForm 方法并将frm对象以及列表对象当做参数传递进去，即可实现对表单数据参数的赋值。

1、获取表单数据

var prepareParamsFromForm = function(frm, store) {
store.baseParams = {};

var params = frm.getValues(true);
// alert(params);

var paramsArr = params.split("&");

for (var i = 0; i < paramsArr.length; i++) {
  var paramsField = paramsArr[i].split("=")[0];
  var paramsValue = paramsArr[i].split("=")[1];
  if (!paramsValue || decodeURI(paramsValue) == "请选择") {
   continue;
  }

  paramsValue = decodeURI(paramsValue);
  // 替换所有%2C为逗号
  while ((paramsValue = paramsValue.replace('%2C', ',')).indexOf('%2C') != -1);

  if (store.baseParams[paramsField]) {
   store.baseParams[paramsField] += "," + paramsValue;
  } else {
   store.baseParams[paramsField] = paramsValue;
  }
}
}

2、对表单数据进行了组装时候则需要调用updateGrid方法更新grid数据

updateGrid(grid, {
          start : 0,
          limit : 20
         }, function() {
          btn.enable();
         });

该公共方法的具体实现如下

var updateGrid = function(grid, params, callback) {
emptyGrid(grid);

var store = grid.getStore();
var tbar = grid.getTopToolbar();
var bbar = grid.getBottomToolbar();

store.load({
    params : params ? params : {},
    callback : function() {
     ////更新分页
     if (tbar) {
      tbar.updateInfo();
     }
     if (bbar) {
      bbar.updateInfo();
     }
     //执行回调
     if (callback && typeof(callback) == 'function') {
      callback();
     }
    }
   });
}

内部的清空列表公共方法如下

/**
* 清空列表
* @param {} grid
*/
var emptyGrid = function(grid) {
if (!grid) {
Ext.MessageBox.alert("错误", "列表不存在");
return;
}

var store = grid.getStore();
if (!store) {
Ext.log("错误", "列表的数据集不存在");
return;
}

//清空复选框
var sm = grid.getSelectionModel();
if (sm) {
  // 清空所有选择项和全选
  var t = Ext.get('x-grid3-hd-checker');
  if (t && t.dom.className == 'x-grid3-hd-checker') {
   var hd = Ext.fly(t.dom.parentNode);
   hd.removeClass('x-grid3-hd-checker-on');
   sm.clearSelections();
  } else {
   sm.clearSelections();
  }
}

var tbar = grid.getTopToolbar();
var bbar = grid.getBottomToolbar();

//数据集
store.removeAll();

//更新分页
if (bbar && bbar.updateInfo) {
  bbar.updateInfo();
  bbar.afterTextEl.el.innerHTML = String.format("共 {0} 页", 1);
  bbar.first.setDisabled(true);
  bbar.prev.setDisabled(true);
  bbar.next.setDisabled(true);
  bbar.last.setDisabled(true);
  //bbar.loading.disable();
}
}