Ext.form.ComboBox 后台取值 动态加载 ext5.0.0

我用的extjs是5.0.0版本的。

开始的时候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();

        });
时间: 2024-11-06 12:53:09

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

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

//向后台传参数动态加载图片 $(function() { $("#Button1").click(function() { var stockcode = getUrlParam("stockcode"); $.ajax({ //要用post方式 type: "Post", //方法所在页面和方法名 url: "IndustryChain.aspx/Photo", contentType: "application

爬取Ajax动态加载网页

常见的反爬机制及处理方式 1.Headers反爬虫 :Cookie.Referer.User-Agent 解决方案: 通过F12获取headers,传给requests.get()方法 2.IP限制 :网站根据IP地址访问频率进行反爬,短时间内进制IP访问 解决方案: 1.构造自己IP代理池,每次访问随机选择代理,经常更新代理池 2.购买开放代理或私密代理IP 3.降低爬取的速度 3.User-Agent限制 :类似于IP限制 解决方案: 构造自己的User-Agent池,每次访问随机选择 5.

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

1 . 什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面. 几个常见的用到ajax的场景. 比如你在逛知乎,你没有刷新过网页,但是你却能看到你关注的用户或者话题有了新动态的消息提示. 还比如,我们在看视频时,可以看到下面

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

一般我们使用python的第三方库requests及框架scrapy来爬取网上的资源,但是设计javascript渲染的页面却不能抓取,此时,我们使用web自动化测试化工具Selenium+无界面浏览器PhantomJS来抓取javascript渲染的页面,下面实现一个简单的爬取 环境搭建 准备工具:python3.5,selenium,phantomjs 我的电脑里面已经装好了python3.5 安装Selenium pip3 install selenium 安装Phantomjs 按照系统

easyui combobox 在datagrid中动态加载数据

场景:datagrid 中用编辑框修改数据,有一个列使用的combobox  在可编辑的时候需要动态绑定数据,这个数据是在根据其他条件可变的 思路:在每次开启编辑框的时候动态绑定数据, datagrid开启 onClickCell: onClickCell//点击触发 onAfterEdit:onAfterEdit//编辑完单元格之后触发的事件 $.extend($.fn.datagrid.methods, { editCell: function (jq, param) { return jq

MVC4中AJAX Html页面打开调用后台方法实现动态加载数据库中的数据

之前一直用window.onload方法来调用js方法来实现,今天纠结能不能换个方法实现. 很明显是可以的. 在html前台页面引用js代码如下 @Scripts.Render("~/Scripts/User/AddUser.js") 这就算引用了,看adduser.js代码如果调用后台方法 $(document).ready( function (){ $.ajax({ type: 'POST', url: "/EditUserPassWord/UserGroupQuery

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

1.安装selenium pip install selenium Collecting selenium Downloading selenium-3.4.1-py2.py3-none-any.whl (931kB) 100% |████████████████████████████████| 942kB 573kB/s Installing collected packages: selenium Successfully installed selenium-3.4.1 2.安装phan

Ajax动态加载数据

前言: 1.这个随笔实现了一个Ajax动态加载的例子. 2.使用.net 的MVC框架实现. 3.这个例子重点在前后台交互,其它略写. 开始: 1.控制器ActionResult代码(用于显示页面) /// <summary> /// 电话查询页面 /// </summary> /// <returns></returns> public ActionResult PhoneSearch(string sql) { phoneList=从数据库查询数据: V

Extjs学习----------动态加载js文件(减轻浏览器的压力)

动态加载js文件可以减轻浏览器的压力,本例使用了Ext.window.Window组件,该组件的学习地址:http://blog.csdn.net/z1137730824/article/details/38538277 具体实现步骤: (1)建立dynamic.jsp文件 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String