EasyUI combobox onSelect

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

本文标签：

  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(){
  12.             $('#cc').combobox({
  13.                 valueField:'id',
  14.                 textField:'text',
  15.                 url:'A.action',
  16.                 onselect:function(record){
  18.                 }
  19.             });
  21.             $('#cdept').combobox({
  22.                 valueField:'id',
  23.                 textField:'text',
  24.                 url:'B.action',
  25.                 onselect:function(record){
  27.                 }
  28.             });
  29.         });
  31.         var enumType = {Year,Dept,...};
  33.         /*
  34.         * 此方法来处理你的所有的combobox的onselect事件
  35.         * type：类型，年度、Dept等，以enumType来定义
  36.         */
  37.         function HandleSelect(type,record){
  38.             switch(type){
  39.                 case enumType.Year:
  40.                      //重新获取下一级的数据
  41.                      //这里可以手动通过ajax和js对象筛选数据
  42.                     var newData = $.ajax({/*....*/});
  43.                     ReloadData('cDept',newData);
  44.                 break;
  45.                 case enumType.Dept:
  46.                 break;
  48.                 //...后续的其他select的处理
  49.             }
  50.         }
  52.         //更新某一个combobox的数据，比如年度改变，可以调用此方法重新加载 单位的数据
  53.         function ReloadData(comboboxId,newData){
  54.             //这里可以通过loadData将combobox的数据重新绑定了。
  55.             $(comboboxId).loadData(newData);
  56.         }
  57.     </script>
  58. </head>
  59. <body>
  60.     <h1>ComboBox</h1>
  61.     <span>Options: </span>
  62.     年度：<select id="cc"  name="dept" style="width:200px;" required="true"></select>
  63.     单位：<select id="cdept"  name="dept2" style="width:200px;" required="true"></select>
  64. </body>
  65. </html>

web技术分享



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

热门标签

关注我们