`

带复选框且支持搜索功能的下拉列表11

 
阅读更多
doQuery : function(q, forceAll)
    {
        if (q === undefined || q === null)
        {            q = '';        }
        var qe = {
            query: q,
            forceAll: forceAll,
            combo: this,
            cancel:false
        };
        if (this.fireEvent('beforequery', qe) === false || qe.cancel){
            return false;
        }
        q = qe.query;
        forceAll = qe.forceAll;        
        if (forceAll === true || (q.length >= this.minChars)){
            if (this.lastQuery !== q){
                this.lastQuery = q;
                if (this.mode == 'local'){
                    this.selectedIndex = -1;
                    //forceAll为true指的是单击下拉框
                    if (forceAll){
                    	//清除过滤条件
                        this.store.clearFilter();
                        for(var i = 0; i < this.store.getCount(); i++){
                        	//store里头存在等于全选的一项,把flag置为false,且跳出循环
                            if("全选" == this.store.getAt(i).get('name')){
	                            rec = this.store.getAt(i);
	                            this.store.remove(this.store.getAt(i));
                            }
                        }
                        //如果recor不为空,并且store里存在元素,并且isExitsAll为真
                        //就往store里插入一项为全选的record的记录
                        if(rec !== undefined && rec !== null 
                            && this.store.getCount() > 0){
                            this.store.insert(0,rec);
                        }
                    }
                    //为false指的是键盘输入
                    else{
                    	//combobox中输入的值是否和store中的相匹配
                    	var rec_flag = false;                    	
                	    if(this.store.getCount()==0){
                	    	rec_flag = true;
                	    }
                	    //循环判断store中是否存在等于全选的记录,如果存在就把这一项移除掉
                	    //并且把rec_flag置为true
                	    for(var i = 0; i < this.store.getCount(); i++){
                            if("全选" == this.store.getAt(i).get('name')){
                            	rec = this.store.getAt(i);
                            	//移除存在等于全选的记录
	                            this.store.remove(this.store.getAt(i));
	                            rec_flag = true;
                            }
                        }
                        //根据在combobox中输入的值在store进行筛选
                    	this.store.filter(this.displayField, q);                    	
                        if(rec !== undefined && rec !== null && rec_flag){
                        	//store中的记录大于0就往store里头插入全选这一项纪录
                        	if(this.store.getCount()>0){
                        	    this.store.insert(0,rec);
                        	}
                        }
                    }
                    this.onLoad();
                }
                else{
                    this.store.baseParams[this.queryParam] = q;
                    this.store.load({
                        params: this.getParams(q)
                    });
                    this.expand();
                }
            }
            else{
                this.selectedIndex = -1;
                this.onLoad();
            }
        }
    },
分享到:
评论

相关推荐

    带复选框且支持搜索功能的下拉列表1(1--14)

    标题中的“带复选框且支持搜索功能的下拉列表1(1--14)”指的是一个具有特定功能的用户界面组件。在Web开发中,这样的组件通常用于提供一个多选项选择的功能,用户可以通过复选框来选取多个选项,并通过搜索框快速...

    QT组合框定制下拉列表为复选框的实现方法

    我们需要覆盖这个方法,使得在弹出下拉列表时,列表中的每个项目都带有复选框,并且这些复选框的状态与模型中的状态同步。 5. **处理用户交互**: 当用户在下拉列表中点击一个复选框时,我们需要捕获这个事件,并...

    WEB页面下拉列表带复选框

    标题 "WEB页面下拉列表带复选框" 描述了一个常见的网页交互元素设计,它将传统的下拉列表与多选功能结合,用户可以在一个下拉菜单中看到多个可选项,并通过勾选复选框来选择多个值。这种设计在数据过滤、用户偏好...

    SelectBox下拉复选框多选插件

    它结合了传统的下拉列表和复选框的特性,使得在有限的空间内,用户能够方便地筛选和选择多个选项。以下是对这个主题的详细说明: 1. **下拉列表多选框**:传统的HTML `&lt;select&gt;` 元素只支持单选,但通过添加多选...

    好用的带搜索的下拉复选框,可灵活改造

    4. **Magicsuggest**:从文件名称列表中我们可以推断,`magicsuggest`可能是一个JavaScript库或者插件,专为实现具有搜索功能的下拉复选框而设计。这个库可能提供了丰富的API和配置选项,开发者可以通过它轻松地在...

    bootstrap-select下拉复选框.rar

    1. **多选**:用户可以通过勾选复选框来选择多个选项。 2. **搜索功能**:在大型选项列表中,用户可以输入关键词进行搜索,快速定位所需选项。 3. **分组**:可以对选项进行分组,使用户更容易理解选项的结构。 4. *...

    js下拉复选框控件,超经典,用了就知道了。

    在JavaScript的世界里,下拉复选框控件是一种常见的用户界面元素,它结合了下拉菜单的紧凑性与多选框的功能性。这种控件在网页应用中广泛使用,允许用户从一组选项中选择多个项,同时保持界面的整洁。在给定的标题和...

    jquery 复选框组件

    jQuery,作为一款强大的JavaScript库,提供了丰富的插件和方法来增强复选框的功能和用户体验。本篇文章将详细探讨jQuery中的复选框组件,特别是基于jQuery UI的Multiselect插件。 ### jQuery 复选框基础 在HTML中...

    select复选框带全选

    在Bootstrap中,"select复选框"通常指的是一个下拉选择列表,其中包含多个可选的选项,用户可以通过勾选这些选项来做出选择。本篇文章将深入探讨如何在Bootstrap中实现带有全选功能的select复选框,以及相关的技术...

    combobox 下拉多选框带搜索功能

    但在多选模式下,用户可以勾选多个选项,这通常通过添加复选框或者允许用户通过键盘快捷键或拖放操作来实现。在JavaScript中,可以使用数组来存储已选中的项,并通过事件监听来处理选择状态的改变。 其次,搜索功能...

    Winform 下拉带Checkbox 功能

    本主题将深入探讨如何实现一个下拉列表框(ComboBox)控件,该控件带有复选框功能,即"Winform 下拉带Checkbox 功能"。这种控件通常用于让用户在多个选项中进行多选操作。 首先,我们需要理解控件的基本构造。在C#...

    带搜索的下拉框,并且支持多选

    这通常通过添加复选框或允许用户通过按住Ctrl或Shift键来实现。在HTML中,可以使用`&lt;select multiple&gt;`属性来创建一个多选的下拉框。然而,对于多选的搜索下拉框,可能需要自定义更复杂的逻辑来处理搜索结果和选中...

    tkinter自定义多选下拉列表框(带滚动条,全选)

    通过上述步骤,我们成功地创建了一个带有滚动条的多选下拉列表框。这个组件不仅可以帮助用户方便地选择多个选项,还提供了简洁的操作方式,极大地提高了用户体验。在实际开发中,可以根据需求进一步定制这个组件,...

Global site tag (gtag.js) - Google Analytics