0

I have to add options into my dropdown with ajax call in jquery's multiselect-filter dropdown.

this is my jsfiddle

I do not have to show any data in dropdown until user type something in filter. The time user type anything in filter box, one ajax call will be made and dropdown will be populated. I am fine with ajax call but how to add new options into dropdown.

I have tried all below options to add options into my dropdown.

1) From here I got the idea source. This is going in an infinite loop.

var el = $("#id").multiselect();

$("#id").multiselect().multiselectfilter({
    filter: function(event, matches){           

        var v = "val", opt = $('<option />', {
            value: v,
            text: v
        });
        opt.appendTo( el );    
        el.multiselect('refresh');
     }
});

2) From here I got the idea source

var myOptions = {
    val1 : 'text1',
    val2 : 'text2'
};
var mySelect = $('#mySelect');
$.each(myOptions, function(val, text) {
    mySelect.append(
        $('<option></option>').val(val).html(text)
    );
});

and few more with little changes here and there. Please suggest.

EDIT

Or is there any way to hide all options from the dropdown and show them only when filter matches with any of them!!!

Community
  • 1
  • 1
Jaikrat
  • 1,124
  • 3
  • 24
  • 45

1 Answers1

0

You can use this:

$('<option />', {
            value: "test",
            text: "test"
        }).appendTo("#test");
$("#test").multiselect('refresh');

fiddle

You can move it in ajax call on success and populate it there with the result you get.

Alex Char
  • 32,879
  • 9
  • 49
  • 70
  • Thanks @Alek.. let me try. – Jaikrat Sep 11 '14 at 11:43
  • Actually.. I have to addthe entry at the time of filtering not at onLoad of the page. – Jaikrat Sep 11 '14 at 12:05
  • Dunno why you want to do something like that.. You can simple populate your multiselect on success of ajax call. Can't find a reason to append while filtering. – Alex Char Sep 11 '14 at 13:01
  • Take a look here if you try to append inside filter http://jsfiddle.net/qstuo306/36/ – Alex Char Sep 11 '14 at 13:07
  • I have around 12K rows which is populated in this dropdown. So I do not want to show all that but to show them when user filter something and I think we should not use ajax on full page load. On first time we already have our processors...right!!!... please correct me if I am wrong. – Jaikrat Sep 11 '14 at 13:09
  • I tried this approach... its going in infinite loop :( – Jaikrat Sep 11 '14 at 13:09
  • Then you don't show anything and make an ajax call each time user types something and populate on success. – Alex Char Sep 11 '14 at 13:10
  • thats what I am not able to do it Alek and asking help for the same :) – Jaikrat Sep 11 '14 at 13:12
  • Without see whole code is difficult to say. The general idea is to follow what i suggest. – Alex Char Sep 11 '14 at 13:15