EasyUI combobox onSelect
时间:13-04-23
栏目:EasyUI, web前端
作者:zongyan86
评论:0 点击: 12,173 次
- $('#selSmpt').combobox({
- onSelect: function (param) {
- $('#txbEmail').val("@" + param.value.substr(param.value.indexOf(".") + 1));
- $('#txbEmail').focus();
- }
- });
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <title>jQuery EasyUI</title>
- <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
- <link rel="stylesheet" type="text/css" href="../themes/icon.css">
- <script type="text/javascript" src="../jquery-1.4.2.min.js"></script>
- <script type="text/javascript" src="../jquery.easyui.min.js"></script>
- <script>
- $(function(){
- $('#cc').combobox({
- valueField:'id',
- textField:'text',
- url:'A.action',
- onselect:function(record){
- }
- });
- $('#cdept').combobox({
- valueField:'id',
- textField:'text',
- url:'B.action',
- onselect:function(record){
- }
- });
- });
- var enumType = {Year,Dept,...};
- /*
- * 此方法来处理你的所有的combobox的onselect事件
- * type:类型,年度、Dept等,以enumType来定义
- */
- function HandleSelect(type,record){
- switch(type){
- case enumType.Year:
- //重新获取下一级的数据
- //这里可以手动通过ajax和js对象筛选数据
- var newData = $.ajax({/*....*/});
- ReloadData('cDept',newData);
- break;
- case enumType.Dept:
- break;
- //...后续的其他select的处理
- }
- }
- //更新某一个combobox的数据,比如年度改变,可以调用此方法重新加载 单位的数据
- function ReloadData(comboboxId,newData){
- //这里可以通过loadData将combobox的数据重新绑定了。
- $(comboboxId).loadData(newData);
- }
- </script>
- </head>
- <body>
- <h1>ComboBox</h1>
- <span>Options: </span>
- 年度:<select id="cc" name="dept" style="width:200px;" required="true"></select>
- 单位:<select id="cdept" name="dept2" style="width:200px;" required="true"></select>
- </body>
- </html>
web技术分享