开始做的时候是想利用url属性把远程数据加载来之后显示combobox,后来要做一个需求就是当远程访问的时候没有数据的时候需要禁用掉一些控件。查了一些资料,并最后得出了下面的代码片段:
onLoadSuccess事件就是在url执行完成之后执行的(但是我不没有查到为什么回调函数里面的代码会执行两次,如果你alert(xxx)的话,会调用两次,求有朋友看见了知道的话,可以帮忙回答一下。)
getData:这个参数传进去之后就是获得远程访问的数据,在这里有一个疑问就是我利用document.getElementById("businessType").combobox("getData");竟然没有获得数据,提示说没有这个方法。不知道为什么(望解答)。
onLoadSuccess:function(){
var data = $('#businessType').combobox('getData');
if(!data){
$('#dowmloadRecords').linkbutton('disable');
$('#businessType').combobox({ disabled: true });
}
else{
$('#dowmloadRecords').linkbutton('enable');
}
}
后来又经过多次的了解,并加了一个技术群,问了里面的大神,他说的是回调函数可以传参数,官网的api没有更新,所以我后来把上面的代码改为如下就可以很好的使用了。
<td>业务类型:<input id="businessType" name="businessType"
class="easyui-combobox"
data-options="
url:'getCurrentBusinessTypeOfUserId.json',
editable:false,
valueField: 'BUSINESSTYPE',
textField: 'BUSINESSTYPENAME',
panelHeight:'auto',
onLoadSuccess:function(data){
if(data.length == 0){
$('#dowmloadRecords').linkbutton('disable');
}
else{
$('#dowmloadRecords').linkbutton('enable');
}
}
" />
</td>
下面结合官网看的指导文档,并做一下笔记。
该组合框显示一个可编辑的文本框,下拉列表,从中用户可以选择一个或多个值。用户可以输入文本进行选择,也可以从列表中选择一个或多个值。
(1)、创建一个combobox从定义好的select元素结构中
<ol class="linenums"><pre name="code" class="java"><select id="cc" class="easyui-combobox" name="dept" style="width:200px;"> <option value="aa">aitem1</option> <option>bitem2</option> <option>bitem3</option> <option>ditem4</option> <option>eitem5</option> </select>
<input id="cc" class="easyui-combobox" name="dept"
data-options="valueField:'id',textField:'text',url:'get_data.php'">
(3)、利用javascript来创建combobox
<input id="cc" name="dept" value="aa">
$('#cc').combobox({
url:'combobox_data.json',
valueField:'id',
textField:'text'
});<span id="result_box" lang="zh-CN"><span><span id="result_box" lang="zh-CN"><span></span></span></span></span>
Combobox用法和方法参数:
1、 需要引入class=" easyui-combobox”
2、 参数设置需要在data-options中设置
3、 属性参数配置:
valueField:基础数据值名称绑定到Combobox(提交值)
textField:基础数据的字段名称绑定的Combobox(显示值)
mode:定义当文本改变时如何加载列表数据,当设置为remote模式下,什么类型的用户将被发送http请求参数名为'q'的服务器,以获取新的数据。
url:从远程URL来加载列表数据
method:http方法检索列表数据
data:列表中被加载的数据
filter:定义如何过滤本地数据“模式”设置为'local'
formatter:定义如何呈现行
loader:定义如何从远程服务器加载数据
4、 事件:
onBeforeLoad(param): 操作之前将数据加载,返回false就取消这个荷载作用
onLoadSuccess():触发时,远程数据加载成功
onLoadError:触发时,远程数据加载错误
ONSELECT:触发,当用户选择一个列表项
onUnselect:触发,当用户取消选择一个列表
5、方法:
$('#cc').combobox('reload'); // reload list data using old URL
$('#cc').combobox('reload','get_data.php'); // reload list data using new URL