需求:需要用两个combobox来输入一个年月的范围,下拉框的内容从服务器获取。需要实现选中前者后,后者的下拉框中不能显示比前者数值小的;选中后者后,前者的下拉框内容不能显示比后者数值大的

有两个combobox,id为dtStartDate和dtEndDate

  1. $(document).ready(function () {
  2. getFullData();
  3. initDateByCity();
  4. })
  5. // 因为两个combobox的下拉框的内容是会变化的,所以要有一个完全的版本用于筛选
  6. // 否则如果使用下拉框的内容作为筛选源,只会越来越少
  7. var FullData;
  8. var getFullData = function () {
  9. $.ajax({
  10. type: 'post',
  11. url: 'your url',
  12. async: true,
  13. success: function (result) {
  14. FullData = result;
  15. }
  16. })
  17. }
  18. var initDateByCity=function(){
  19. $('#dtStartDate').combobox({
  20. url: 'your url',
  21. valueField: 'Val',
  22. textField: 'Val',
  23. multiple: false,
  24. model: 'remote',
  25. method: 'post',
  26. // 使用onSelect会陷入死循环
  27. onClick: function (item) {
  28. // 注意这里获取的是完全版本的复制,而不是引用
  29. var data = FullData.slice(0);
  30. var j=0;// 因为data进行删除后,index会和FullData不一致,以此纠正
  31. for (var i in FullData) {
  32. if (FullData[i].Val < item.Val) {
  33. data.splice(j, 1);
  34. j--;
  35. }
  36. j++;
  37. }
  38. // 重新加载
  39. $('#dtEndDate').combobox("loadData", data);
  40. }
  41. });
  42. // 上同
  43. $('#dtEndDate').combobox({
  44. url: 'your url',
  45. valueField: 'Val',
  46. textField: 'Val',
  47. multiple: false,
  48. model: 'remote',
  49. method: 'post',
  50. onClick: function (item) {
  51. var data = FullData.slice(0);
  52. var j=0;
  53. for (var i in FullData) {
  54. if (FullData[i].Val > item.Val) {
  55. data.splice(j, 1);
  56. j--;
  57. }
  58. j++;
  59. }
  60. $('#dtStartDate').combobox("loadData", data);
  61. }
  62. });
  63. }

easyui-combobox实现取值范围的联动的更多相关文章

  1. easyui combobox 的取值问题

    easy-combobox 取值问题 例子:<select id="cc" class="easyui-combobox" name="cc&q ...

  2. jquery 获取easyui combobox选中的值、赋值

    jquery easyui combobox 控件支持单选和多选 1.获取选中的值 $('#comboboxlist').combobox('getValue');  //单选时 $('#combob ...

  3. easyui 》 radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中

    获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...

  4. easyUI中datetimebox和combobox的取值方法

    easyUi页面布局中,查询条件放在JS中,如下 <script type="text/javascript"> var columnList = [ [   {    ...

  5. Ext.form.ComboBox 后台取值 动态加载 ext5.0.0

    我用的extjs是5.0.0版本的. 请注意:如果这里没有的combobox相关内容,这里一定有. 开始的时候keyup事件取到的数据就是放不到ComboBox中,放全局变量也不好用.最后大神出手帮忙 ...

  6. easyui validatebox textbox 取值和赋值

    总结:表单元素使用easyui时,textbox和validatebox设置值和获取值的方式不一样 text-box设置值只能使用id选择器选择表单元素,只能使用textbox("setVa ...

  7. easyui combobox 不能选中值的问题

    easyui comboxbox 下拉框加载到数据,但是不能选中.一般情况是重复渲染,页面有同名元素,valueField重复. 这次遇到的具体问题是,第一次刷新页面,可以选中,第二次不能选中.考虑到 ...

  8. EasyUI Combobox 设置默认值

    /** *绑定运营商,设置默认值, 显示CMCC, 传值1 */ $('#operatingId').combobox({ url:'data_url', valueField:'id', textF ...

  9. EASYUI赋值和取值

       $("#ajname").textbox("setValue",name);      $("#jyzjg").combobox(&q ...

  10. EasyUI Combobox设定默认值

    $(function () { $('#Select6').combobox({ onLoadSuccess: function () { var data = $('#Select6').combo ...

随机推荐

  1. windows快速找到host文件

    https://jingyan.baidu.com/article/1e5468f96f7345484961b71e.html

  2. IEEE Access的模板的问题

    这个模板果然问题还是有一些,比如caption换行得自己改class文件.首先感谢一下CSDN的一位网友的经验https://blog.csdn.net/baidu_21381705/article/ ...

  3. Linux部署之批量自动安装系统之DHCP篇

    1.         安装:yum install dhcp   2.         Ip配置信息   3.         Dhcp配置文件如下   4.         配置完后检查语法是否错误 ...

  4. css3 -阻止元素成为鼠标事件目标 pointer-events

    pointer-events:auto|none 其中pointer-events:none:元素永远不会成为鼠标事件的target. <!DOCTYPE html> <html l ...

  5. MyBatis中关于SQL标签的用法(重用SQL 代码段)

    一. 没用sql标签前的SQL映射代码: <select id="findById" resultType="cn.tedu.mybatis.entity.User ...

  6. 注解@SuppressWarnings

    在JAVA中注解@SuppressWarnings("deprecation")的Deprecation是什么意思 过期的 @SuppressWarnings("depr ...

  7. Vir-manager 创建虚拟机

  8. PHP设计模式(三)抽象工厂模式(Abstract Factory)

    一.什么是抽象工厂模式 抽象工厂模式的用意为:给客户端提供一个接口,可以创建多个产品族中的产品对象 ,而且使用抽象工厂模式还要满足以下条件: 系统中有多个产品族,而系统一次只可能消费其中一族产品. 同 ...

  9. linux的一页是多大

    命令 getconf PAGESIZE 结果为4096,即一页=4096字节=4KB(注意是Byte,1B=8bit) 在使用mmap映射函数时,它的实际映射单位也是以页为单位的,即不过我们把MAP_ ...

  10. mac和iphone处理视频

    今天在微信上面发现有视频打不开,也无法下载到相册 而到电脑上可以打开 搜了一下,发现格式不对,mp4有很多格式,有的是苹果支持不了的. 要下载一个转换器,我下载了“超级转霸”,然后把视频转成了ipho ...