我用的extjs是5.0.0版本的。

  请注意:如果这里没有的combobox相关内容,这里一定有。

开始的时候keyup事件取到的数据就是放不到ComboBox中,放全局变量也不好用。最后大神出手帮忙解决了这个问题~~~

查看API的时候,对象没有找对,以至于方法事件都用不了。

总结出来方便查阅~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

输入号码结束--触发事件---从后台取数据---将数据放到下拉列表中

输入手机号

// 输入电话号
var $inpTel = new Ext.form.TextField({
fieldLabel: '电话号',
labelWidth: 70,
regex: /^[1]\d{10}$/,
enableKeyEvents: true,
margin: "10 10 0 10"
}); // 显示号码状态
var $telState = new Ext.form.Label({
text: '',
margin: '0 0 0 85',
style: {
color: 'red'
}
}); // 获取产品列表的参数
var params = {
'phone': $inpTel.getValue()
}; var $comboboxProductList; // 产品列表数据
var remoteStore = Ext.create('Ext.data.Store', {
proxy: ({
type: "ajax",
method: "POST",
url:-------路径--------,
reader: {
type: 'json',
successProperty:"success",
rootProperty: "data",
transform: {
fn: function(data) {
var code = data["code"];
var message = data["message"];
var data = data["data"];
//console.dir(code);
//console.dir(message);
if (code!=0) {
$comboboxProductList.disable();
$telState.setText('手机号码有误');
}else{
$comboboxProductList.enable();
$comboboxProductList.setValue(data[0]["productId"]);
}
return data;
},
scope: this
}
}
}),
//listeners: {
// load: function (store, records, successful, eOpts) {
// console.log("====>[store.getData()]");console.log(store.getData());
// console.log("====>[records]");console.log(records);
// console.log("====>[successful]");console.log(successful);
// console.log("====>[eOpts]");console.log(eOpts);
// }
//},
fields: ["productId", "productName"]
}); //选择下拉框
$comboboxProductList = new Ext.form.ComboBox({
fieldLabel: 'AAAAAA',
margin: '5 0 0 10',
labelWidth: 70,
emptyText: '请选择',
autoSelect:true,
displayField: 'productName', //下拉显示
valueField: 'productId',
forceSelection: true,
queryDelay: 300,
store: remoteStore,
queryMode: 'remote',
hiddenName: 'productId'
}); // 给号码获取下拉框
$inpTel.on('keyup', function () {
// 不满足检查条件
if (this.getValue().length != 11) return; // 满足检查条件,修改store请求参数
var params = {
'phone': $inpTel.getValue()
}; remoteStore.getConfig("proxy").setExtraParams(params);
remoteStore.load(); });

Ext.form.ComboBox 后台取值 动态加载 ext5.0.0的更多相关文章

  1. asp.net向后台传参数动态加载图片

    //向后台传参数动态加载图片 $(function() { $("#Button1").click(function() { var stockcode = getUrlParam ...

  2. 爬虫——爬取Ajax动态加载网页

    常见的反爬机制及处理方式 1.Headers反爬虫 :Cookie.Referer.User-Agent 解决方案: 通过F12获取headers,传给requests.get()方法 2.IP限制 ...

  3. Python网络爬虫_爬取Ajax动态加载和翻页时url不变的网页

    1 . 什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新 ...

  4. python+selenium+PhantomJS爬取网页动态加载内容

    一般我们使用python的第三方库requests及框架scrapy来爬取网上的资源,但是设计javascript渲染的页面却不能抓取,此时,我们使用web自动化测试化工具Selenium+无界面浏览 ...

  5. easyui combobox 在datagrid中动态加载数据

    场景:datagrid 中用编辑框修改数据,有一个列使用的combobox  在可编辑的时候需要动态绑定数据,这个数据是在根据其他条件可变的 思路:在每次开启编辑框的时候动态绑定数据, datagri ...

  6. Python爬虫学习——使用selenium和phantomjs爬取js动态加载的网页

    1.安装selenium pip install selenium Collecting selenium Downloading selenium-3.4.1-py2.py3-none-any.wh ...

  7. 根据返回值动态加载select

    // 路由 if (return_routeChoice != null && return_routeChoice != "") { for (var i = 0 ...

  8. Ext JS学习第十天 Ext基础之动态加载JS文件(补充)

    此文用来记录学习笔记: •Ext4.x版本提供的一大亮点就是Ext.Loader这个类的动态加载机制!只要遵循路径规范,即可动态加载js文件,方便把自己扩展组件动态加载进来,并且减轻浏览器的压力. • ...

  9. Ajax动态加载数据

    前言: 1.这个随笔实现了一个Ajax动态加载的例子. 2.使用.net 的MVC框架实现. 3.这个例子重点在前后台交互,其它略写. 开始: 1.控制器ActionResult代码(用于显示页面) ...

随机推荐

  1. JS面向对象组件(六) -- 拖拽功能以及组件的延展

    HTML部分 <div id="div1"></div> <div id="div2"></div> CSS部分 ...

  2. 谷歌浏览器如何设置可以解决Ajax跨域问题?

    Ajax本身是不支持跨域的,跨域问题其实很简单,通过浏览器的相应设置可以完成两个不同的服务器或两个不同服务下的项目互相访问.希望大家给予评价及投票. 方法/步骤   首先谷歌快捷方式上右击,在下拉列表 ...

  3. TCP/UDP常见问题小结

    1,udp丢包 困扰几天的udp内网传输部分终于做通了,解决的关键就在于setsockopt的调用,设置接收缓冲. 遇到的问题是这样的,主机端发送udp数据包: 应用层的包大小为1452byte大小, ...

  4. 深入理解Linux内核-第七章 进程调度

    原文:http://blog.csdn.net/sailor_8318/article/details/2460177

  5. 锁之“轻量级锁”原理详解(Lightweight Locking)

    大家知道,Java的多线程安全是基于Lock机制实现的,而Lock的性能往往不如人意. 原因是,monitorenter与monitorexit这两个控制多线程同步的bytecode原语,是JVM依赖 ...

  6. OpenERP 7.0 中文报表PDF乱码(WindowsXP)

    OpenERP默认安装输出的PDF中文报表都是一些方块: 此问题可以通过oecn_base_fonts模块解决: 更多关于oecn_base_fonts的信息请参考: 1. OpenERPv7.0 中 ...

  7. PHP.ini 配置文件解析

    [PHP] ;;;;;;;;;;;;;;;;;;;; About php.ini   ;;;;;;;;;;;;;;;;;;;;; PHP's initialization file, generall ...

  8. 指定URL,计算文件大小

    将http://www.baidu.com替换成指定的URL,就可以获得文件的大小. 文件大小已经转换为以KB为单位. url对象用openconnection()打开连接:获得URLConnecti ...

  9. motan源码解读:注册中心zookeeper(1)

    Apache ZooKeeper is an effort to develop and maintain an open-source server which enables highly rel ...

  10. c#中@符号作用

    用 @ 符号加在字符串前面表示其中的转义字符“不”被处理. 如果我们写一个文件的路径,例如"D:/文本文件"路径下的text.txt文件,不加@符号的话写法如下: string f ...