ext.form.combobox的联动

新手,废了蛮多时间才把ext.form.combobox的联动做出来了,与大家分享,希望可以帮到大家。

效果图:微笑


先上代码:JS文件

///<reference path="vswd-ext_2.0.2.js" />
Ext.onReady(function () {
    Ext.define("comboboxdata1", {
        extend: "Ext.data.Model",
        fields: [
             "tbname", "tbdesc"
        ]
    });
    var store1 = Ext.create("Ext.data.Store", {
        storeId: "store1",
        model: "comboboxdata1",
        proxy: {
            type: "ajax",
            url: "ComboData.ashx",
            reader: {
                type: "json",
                root: "root"
            }
        }
    });
    Ext.define("comboboxdata2", {
        extend: "Ext.data.Model",
        fields: [
             "listname", "listdesc", "tbname"
        ]
    });
    var store2 = Ext.create("Ext.data.Store", {
        storeId: "store2",
        model: "comboboxdata2",
        proxy: {
            type: "ajax",
            url: "ComboData1.ashx",
            reader: {
                type: "json",
                root: "combo2root"
            }
        }
    });
    store2.load();
    var store3 = Ext.create("Ext.data.Store", {
        fields: [
             "listname", "listdesc", "tbname"
        ]
    });
    var combo1 = Ext.create("Ext.form.ComboBox", {
        id: "c1",
        valueField: "tbname",
        fieldLabel: "选择条件",
        store: store1,
        displayField: "tbdesc",
        listeners: {
            change: function (f, n, o) {

                store3.removeAll();
                combo2 = Ext.getCmp("c2");
                combo2.reset();
                combo3 = Ext.getCmp("c3");
                combo3.reset();
                store2.each(function (record) {
                   //过滤表列名

                    if (record.get('tbname') == n) {
                        store3.add(record);
                    };
                });
            }
        }
    });

    var combo2 = Ext.create("Ext.form.ComboBox", {
        id: "c2",
        store: store3,
        queryMode: 'local',
        valueField: "listname",
        displayField: "listdesc"
    });

    var combo3 = Ext.create("Ext.form.ComboBox", {
        id: "c3",
        store: store3,
        queryMode: 'local',
        valueField: "listname",
        displayField: "listdesc"
    });
    var selectbut = Ext.create('Ext.Button', {
        text: '搜索',
        handler: function () {
            var listname2 = Ext.getCmp('c2').getValue();
            var listname3 = Ext.getCmp('c3').getValue();
            //排除为null时,赋值为""  
            if (!listname2) {
                sexCode = "";
            }
            if (!listname3) {
                nameCode = "";
            }
            alert("listname2:" + listname2 + "\nlistname3:" + listname3);
        }
    });
    var tb = Ext.create("Ext.toolbar.Toolbar",
        { renderTo: "combo1", items: [
        combo1, combo2,combo3,selectbut]
        });
});


后台读出来的数据

Store1的数据:

{root:[{"tbname":"vw_ccx","tbdesc":"员工信息表"},{"tbname":"itemTurnoverMsg","tbdesc":"员工物品进出表"},{"tbname":"message_2D","tbdesc":"员工物品登记表"}]}
 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Configuration;
using System.Text;
using System.Web.Script.Serialization;
using System.Data.SqlClient;


namespace extjstest_CShape
{
    /// <summary>
    /// ComboData 的摘要说明
    /// </summary>
    public class ComboData : IHttpHandler
    {
        public void ProcessRequest(HttpContext context)
        {


            context.Response.ContentType = "text/javascript";
            string connstr = ConfigurationManager.ConnectionStrings["ItemManageSystemConnectionString2"].ConnectionString;
            SqlConnection conn = new SqlConnection(connstr);
            conn.Open();
            string sqlstr = "select * from listdescription";
            SqlCommand cmd = new SqlCommand(sqlstr, conn);
            SqlDataReader sdr = cmd.ExecuteReader();
            
            context.Response.Write(GetJSON(conn,sdr, "T_Ware"));
        }
        protected string GetJSON(SqlConnection conn,SqlDataReader drValue, string strTableName)
        {
            
            List<tablename> tbdescs = new List<tablename>();
            tablename tbdesc1 = new tablename();
            tablename tbdesc2 = new tablename(); 
            tablename tbdesc3 = new tablename();
            int tbdesccount1 = 0;
            int tbdesccount2 = 0;
            int tbdesccount3 = 0;
            try
            {
                
                while (drValue.Read())
                {
                    #region
                    if (drValue["tbname"].ToString().Trim() == "vw_ccx") 
                    {
                        if (tbdesccount1 == 0) 
                        { 
                            tbdesccount1++;
                            tbdesc1.tbdesc = "员工信息表";
                            tbdesc1.tbname = drValue["tbname"].ToString().Trim();
                        }
                    }
                    if (drValue["tbname"].ToString().Trim() == "itemTurnoverMsg")
                    {
                        if (tbdesccount2 == 0)
                        {
                            tbdesccount2++;
                            tbdesc2.tbdesc = "员工物品进出表";
                            tbdesc2.tbname = drValue["tbname"].ToString().Trim();
                        }
                    }
                    if (drValue["tbname"].ToString().Trim() == "message_2D")
                    {
                        if (tbdesccount3 == 0)
                        {
                            tbdesccount3++;
                            tbdesc3.tbdesc = "员工物品登记表";
                            tbdesc3.tbname = drValue["tbname"].ToString().Trim();
                        }
                    }
                    #endregion
                }
                tbdescs.Add(tbdesc1);
                tbdescs.Add(tbdesc2);
                tbdescs.Add(tbdesc3);
            }
            catch (Exception ex)
            {
                throw new Exception(ex.Message);
            }
            finally
            {
                drValue.Close();
                conn.Close();
            }


            JavaScriptSerializer jsSerializer = new JavaScriptSerializer();
            StringBuilder sb = new StringBuilder("{");
            sb.Append("root:");
            sb.Append(jsSerializer.Serialize(tbdescs));
            sb.Append("}");
            return sb.ToString();
        } 


        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

Store2的数据:

{combo2root:[{"listname":"nothing","listdesc":"","tbname":"vw_ccx"},{"listname":"department","listdesc":"部门","tbname":"vw_ccx"},{"listname":"dorm_number","listdesc":"宿舍号","tbname":"vw_ccx"},{"listname":"emp_name","listdesc":"员工姓名","tbname":"vw_ccx"},{"listname":"card_number","listdesc":"员工厂牌号","tbname":"vw_ccx"},{"listname":"sex","listdesc":"性别","tbname":"vw_ccx"},{"listname":"in_date","listdesc":"入住时间","tbname":"vw_ccx"},{"listname":"area","listdesc":"宿舍区号","tbname":"vw_ccx"},{"listname":"nothing","listdesc":"","tbname":"message_2D"},{"listname":"dorm_number","listdesc":"宿舍号","tbname":"message_2D"},{"listname":"emp_name","listdesc":"员工姓名","tbname":"message_2D"},{"listname":"makeperson","listdesc":"制码人","tbname":"message_2D"},{"listname":"makedate","listdesc":"制码时间","tbname":"message_2D"},{"listname":"card_number","listdesc":"员工厂牌号","tbname":"message_2D"},{"listname":"sex","listdesc":"性别","tbname":"message_2D"},{"listname":"in_date","listdesc":"入住时间","tbname":"message_2D"},{"listname":"area","listdesc":"宿舍区号","tbname":"message_2D"},{"listname":"number2D","listdesc":"二维码编码","tbname":"message_2D"},{"listname":"nothing","listdesc":"","tbname":"itemTurnoverMsg"},{"listname":"number2D","listdesc":"二维码编码","tbname":"itemTurnoverMsg"},{"listname":"card_number","listdesc":"员工厂牌号","tbname":"itemTurnoverMsg"},{"listname":"emp_name","listdesc":"员工姓名","tbname":"itemTurnoverMsg"},{"listname":"dorm_number","listdesc":"宿舍号","tbname":"itemTurnoverMsg"},{"listname":"item_in","listdesc":"物品进区时间","tbname":"itemTurnoverMsg"},{"listname":"item_out","listdesc":"物品出区时间","tbname":"itemTurnoverMsg"},{"listname":"register_emp","listdesc":"登记人员姓名","tbname":"itemTurnoverMsg"},{"listname":"register_card","listdesc":"登记人员厂牌号","tbname":"itemTurnoverMsg"}]}

后台语句:

经验总结:要注意store是什么时候加载的,如果把store2放到combo1 去加载,那就过滤不了了(我自己试的时候是这样的)
还有为什么要用store3来存放combo2和combo3的数据那是在这为学者那得到的提示!点击打开链接
如果大家有什么更好的方法请指导下我哦,谢谢。
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值