EasyUI combobox onSelect

时间:13-04-23 栏目:EasyUI, web前端 作者:zongyan86 评论:0 点击: 12,173 次

  1.  $('#selSmpt').combobox({
  2.         onSelect: function (param) {
  3.             $('#txbEmail').val("@" + param.value.substr(param.value.indexOf(".") + 1));
  4.             $('#txbEmail').focus();
  5.         }
  6.     });

 

  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  4. <title>jQuery EasyUI</title>
  5.     <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
  6.     <link rel="stylesheet" type="text/css" href="../themes/icon.css">
  7.     <script type="text/javascript" src="../jquery-1.4.2.min.js"></script>
  8.     <script type="text/javascript" src="../jquery.easyui.min.js"></script>
  9.     <script>
  10.         $(function(){
  11.             $('#cc').combobox({
  12.                 valueField:'id',
  13.                 textField:'text',
  14.                 url:'A.action',
  15.                 onselect:function(record){
  16.                 }
  17.             });
  18.             $('#cdept').combobox({
  19.                 valueField:'id',
  20.                 textField:'text',
  21.                 url:'B.action',
  22.                 onselect:function(record){
  23.                 }
  24.             });
  25.         });
  26.         var enumType = {Year,Dept,...};
  27.         /*
  28.         * 此方法来处理你的所有的combobox的onselect事件
  29.         * type:类型,年度、Dept等,以enumType来定义
  30.         */
  31.         function HandleSelect(type,record){
  32.             switch(type){
  33.                 case enumType.Year:
  34.                      //重新获取下一级的数据
  35.                      //这里可以手动通过ajax和js对象筛选数据
  36.                     var newData = $.ajax({/*....*/});
  37.                     ReloadData('cDept',newData);
  38.                 break;
  39.                 case enumType.Dept:
  40.                 break;
  41.                 //...后续的其他select的处理
  42.             }
  43.         }
  44.         //更新某一个combobox的数据,比如年度改变,可以调用此方法重新加载 单位的数据
  45.         function ReloadData(comboboxId,newData){
  46.             //这里可以通过loadData将combobox的数据重新绑定了。
  47.             $(comboboxId).loadData(newData);
  48.         }
  49.     </script>
  50. </head>
  51. <body>
  52.     <h1>ComboBox</h1>
  53.     <span>Options: </span>
  54.     年度:<select id="cc"  name="dept" style="width:200px;" required="true"></select>
  55.     单位:<select id="cdept"  name="dept2" style="width:200px;" required="true"></select>
  56. </body>
  57. </html>

web技术分享



声明: 本文由( zongyan86 )原创编译,转载请保留链接: EasyUI combobox onSelect

关注我们