Extjs 项目中常用的小技巧,也许你用得着(5)--设置 Ext.data.Store 传参的请求方式
时间:2022-05-03
本文章向大家介绍Extjs 项目中常用的小技巧,也许你用得着(5)--设置 Ext.data.Store 传参的请求方式,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
1.extjs 给怎么给panel设背景色
设置bodyStyle:'background:#ffc;padding:10px;',
var resultsPanel = Ext.create('Ext.panel.Panel', {
title: 'Results',
width: 600,
height: 400,
renderTo: Ext.getBody(),
bodyStyle: 'background:#ffc; padding:10px;',
layout: {
type: 'vbox', // Arrange child items vertically
align: 'stretch', // Each takes up full width
padding: 5
},
items: [{ // Results grid specified as a config object with an xtype of 'grid'
xtype: 'grid',
columns: [{header: 'Column One'}], // One header just for show. There's no data,
store: Ext.create('Ext.data.ArrayStore', {}), // A dummy empty data store
flex: 1 // Use 1/3 of Container's height (hint to Box layout)
}, {
xtype: 'splitter' // A splitter between the two child items
}, { // Details Panel specified as a config object (no xtype defaults to 'panel').
title: 'Details',
bodyPadding: 10,
items: [{
fieldLabel: 'Data item',
xtype: 'textfield'
}], // An array of form fields
flex: 2 // Use 2/3 of Container's height (hint to Box layout)
}]
});
2. Extjs4.0 设置 Ext.data.Store 传参的请求方式
var Store = Ext.create('Ext.data.Store', {
pageSize: pageSize,
model: 'Ext.data.Model名称',
autoLoad: false,
proxy: {
type: 'ajax',
url: '请求路径',
getMethod: function(){ return 'POST'; },//亮点,设置请求方式,默认为GET
reader: {
type: 'json',
root: 'Data',
totalProperty: 'totalCount'
}
},
listeners: {
'beforeload': function (store, op, options) {
var params = {
//参数
};
Ext.apply(store.proxy.extraParams, params);
}
}
});
3.ExtJS grid 带参数查询分页 store 传额外参数解决办法
在store的beforeload事件里面重写store.proxy.extraParams,添加新参数
就不必每次都手动的添加参数
store.on('beforeload', function (store, options) {
var new_params = { name: Ext.getCmp('search').getValue() };
Ext.apply(store.proxy.extraParams, new_params);
// alert('beforeload');
});
在Extjs3 中的
store.on('beforeload', function () {
store.baseParams = {
name: '5555555',
intss: '666666666'
};
});
下面给出完整的代码。原理很简单,将搜索条件放在store的baseParams中,每次加载都赋值。
只是需要强制赋值,因为默认的pagetoolbar只会把start、limit、page、sort、dir传递给store。
var store = new Ext.data.Store({
pageSize: GridPageSize,
model: 'Master',
autoLoad: false,
proxy: {
type: 'ajax',
url: '/master/GetMasterData',
reader: {
type: 'json',
root: 'data',
totalProperty: 'totalCount'
}
},
fields: [
{ name: 'Id' },
{ name: 'Master_Name' }
//排序
sorters: [{
property: 'Master_Name',
direction: 'DESC'
}]
});
store.on('beforeload', function (store, options) {
var new_params = { name: Ext.getCmp('search').getValue() };
Ext.apply(store.proxy.extraParams, new_params);
// alert('beforeload');
});
store.load({
params: { start: 0, limit: GridPageSize }
})
- SQL Sever索引
- 使用SQL Server Management Studio 2008 将数据库里的数据导成脚本
- jquery mobile 移动web(5)
- [C#6] 1-using static
- WordPress 中的 Debug 模式(调试模式)
- Windows Server 2008 R2 Server Core 的 Microsoft .NET Framework 4安装程序
- [C#6] 4-string 插值
- 使用API Key验证WCF Data Service
- WordPress By Example:一个WordPress 主题搜索引擎
- jquery mobile 移动web(4)
- [C#6] 3-null 条件运算符
- ServiceStack.Redis 使用教程
- WordPress 标签页面只有一篇文章时自动跳转到该文章
- OS X 上使用.NET开发应用程序
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法