搜索不在动态Bootstrap Multiselect中工作

时间:2016-02-08 08:24:36

标签: javascript jquery twitter-bootstrap

我正在使用 http://davidstutz.github.io/bootstrap-multiselect/用于在我的网页中创建引导程序多选控件。

以下关于静态数据的小提琴链接是我想要使用动态数据实现的:

https://jsfiddle.net/DROCKS/mrmLrsad/4/

//please refer the fiddle

如果选择框的值是静态的,搜索选项可以正常工作,但如果它们是动态创建的,则会创建多选。但是,搜索过滤器在这种情况下不起作用。然而,我的代码类似于下面的小提琴,唯一的区别是搜索过滤器部分在我的实际代码中不起作用,但在这个小提琴中起作用。

与动态数据建立联系。 https://jsfiddle.net/DROCKS/mrmLrsad/5/

//please refer the fiddle

这是我的代码。 HTML代码

<select id="lstFieldList" ></select>

jQuery代码[更新]:

function uncheckFields(field_id)
{
    $('#' + field_id).multiselect('deselectAll', true);
}

//json_obj is the value from the fiddle.

createMultiSelectBox(json_obj);

//this function creates the multiselect
function createMultiSelectBox(json_obj)
{
    var element_String = "";
    var default_ele_set = 0;
    var def_element_first = "1";                            //if the first Y flag should be considered
    var def_element_last = "n";                             //if the last Y flag should be considered
    var def_element = def_element_first;            //change the value here to toggle between default selection
    var tmp = [];

    for (var key in json_obj)
    {
        var val = json_obj[key];
        //alert("Key: " + key);

        var chk_box_ctr = 0;
        var element;

        for(var child_key in val)
        {
            //alert("key: " + child_key + "\nvalue: " + val[child_key]);

            var default_value = child_key.split(",")[7];

            //alert("default_value: " + default_value);

            if(!chk_box_ctr)
            {
                g_max_PageSize = child_key.split(",")[8];
                //alert("g_max_PageSize: " + g_max_PageSize);
            }

            if(def_element == def_element_first)
            {
                if(default_value == "Y" && !default_ele_set)
                {
                    //element_String += '<option value="' + child_key + '" selected="selected">' + val[child_key] + '</option>';
                    element = {"label": val[child_key],"value":child_key};
                }
                else
                {
                    //element_String += '<option value="' + child_key + '">' + val[child_key] + '</option>';
                    element = {"label": val[child_key],"value":child_key};
                }
            }
            else
            {
                if(default_value == "Y")
                {
                    //element_String += '<option value="' + child_key + '" selected="selected">' + val[child_key] + '</option>';
                    element = {"label": val[child_key],"value":child_key};
                }
                else
                {
                    //element_String += '<option value="' + child_key + '">' + val[child_key] + '</option>';

                    element = {"label": val[child_key],"value":child_key};
                }
            }
            tmp.push(element);
        }

        if(def_element == def_element_last)
        {
            uncheckFields('lstFieldList');
        }
    }

    //$('#lstFieldList').append(element_String);

    //$('#lstFieldList').multiselect('rebuild');

    $("#lstFieldList").multiselect('dataprovider', tmp);

    $('#lstFieldList').multiselect({
        maxHeight: 200,
        buttonWidth:"100%",
        enableFiltering:true,
        enableCaseInsensitiveFiltering:true,
        /*maxHeight: 200,
        enableCaseInsensitiveFiltering: true,
        //enableFiltering: true,
        onChange: function(option, checked, select) {
            alert('Changed option ' + $(option).val() + '.' + "\nchecked: " + checked + "\nselect: " + select);

            if(checked)
            {
                //uncheckFields('lstFieldList');
            }
            else
            {
                uncheckFields('lstFieldList');
            }
        }*/
    });

    var elem = $('#lstFieldList').next();
    elem.attr('class',(elem.attr('class') + ' open'));
}

可能是什么问题?因为两个文件中都存在相同的代码。

任何帮助都将不胜感激。

提前致谢。

2 个答案:

答案 0 :(得分:2)

创建一个数组#pragma once #include <time.h> #include <string> #include <cwchar> #include <vector> #include <map> using std::wstring; using std::vector; using std::map; /* constants defined in winnt.h : #define FILE_ACTION_ADDED 0x00000001 #define FILE_ACTION_REMOVED 0x00000002 #define FILE_ACTION_MODIFIED 0x00000003 #define FILE_ACTION_RENAMED_OLD_NAME 0x00000004 #define FILE_ACTION_RENAMED_NEW_NAME 0x00000005 */ #define FILE_ACTION_MOVED 0x00000006 class FileActionInfo { public: LPWSTR fileName; CHAR drive; DWORD action; time_t timestamp; FileActionInfo(LPCWSTR fileName, CHAR drive, DWORD action) { this->fileName = (WCHAR*) GlobalAlloc(GPTR, sizeof(WCHAR)*(wcslen(fileName)+1)); wcscpy(this->fileName, fileName); this->drive = drive; this->action = action; this->timestamp = time(NULL); } ~FileActionInfo() { GlobalFree(this->fileName); } }; /* There are two structures storing pointers to FileActionInfo items : a vector and a map. This is because we need to be able to: 1) quickly retrieve the latest added item 2) quickly search among all queued items (in which case we use fileName as hashcode) */ class FileActionQueue { private: vector<FileActionInfo*> *qActionQueue; map<wstring, vector<FileActionInfo*>> *mActionMap; void Queue(vector<FileActionInfo*> *v, FileActionInfo* lpAction) { v->push_back(lpAction); } void Dequeue(vector<FileActionInfo*> *v, FileActionInfo* lpAction) { for(int i = 0, nCount = v->size(); i < nCount; ++i){ if(lpAction == v->at(i)) { v->erase(v->begin() + i); break; } } } public: FileActionQueue() { this->qActionQueue = new vector<FileActionInfo*>; this->mActionMap = new map<wstring, vector<FileActionInfo*>>; } ~FileActionQueue() { delete qActionQueue; delete mActionMap; } void Add(FileActionInfo* lpAction) { this->Queue(&((*this->mActionMap)[lpAction->fileName]), lpAction); this->Queue(this->qActionQueue, lpAction); } void Remove(FileActionInfo* lpAction) { this->Dequeue(&((*this->mActionMap)[lpAction->fileName]), lpAction); this->Dequeue(this->qActionQueue, lpAction); } FileActionInfo* Last() { vector<FileActionInfo*> *v = this->qActionQueue; if(v->size() == 0) return NULL; return v->at(v->size()-1); } FileActionInfo* Search(LPCWSTR fileName, DWORD action, PCHAR drives) { FileActionInfo* result = NULL; vector<FileActionInfo*> *v; if( v = &((*this->mActionMap)[fileName])) { for(int i = 0, nCount = v->size(); i < nCount && !result; ++i){ FileActionInfo* lpAction = v->at(i); if(wcscmp(lpAction->fileName, fileName) == 0 && lpAction->action == action) { int j = 0; while(drives[j] && !result) { if(lpAction->drive == drives[j]) result = lpAction; ++j; } } } } return result; } };

在为选项

循环时创建这样的json
var tmp = [];

并将每个元素推送到tmp

element = {"label": this.Name,"value":this.id};

并将此tmp.push(element); 数组传递给多选

tmp

并通过

添加多选到下拉列表
$("#lstFieldList").multiselect('dataprovider', tmp);

答案 1 :(得分:0)

我实际上发现了与引导程序multiselect插件相关的代码中导致异常行为的原因。 Anoop给我的代码是对的,在过去的几个月里我也尝试了与同一个插件相关的各种不同的代码,但后来我放弃了使用插件的想法。

然后在上周最后一次修改相同的代码时,我发现我在html页面中包含了一些js脚本文件。所以我尝试为html中的文件注释掉每个include语句,以确定导致该问题的文件。所以在这样做时我到达了一个特定的js文件。

一旦确定了文件,我只需要找出导致问题的功能到插件的建议逻辑。因此,为了确定这一点,我一直在评论/删除函数,直到我到达导致问题的函数。有一个与window.setTimeout相关的代码。正是由于这个功能,现有的建议逻辑不起作用,因为代码进入了这个块。所以我后来添加了一些标记逻辑,以避免在我的情况下运行此函数。

非常感谢您的投入......