Clever Geek Handbook

Select2 shift event not working

I am using Select2 and I need to do some dropdown based functionality.

I tried the following code but it didn't work for me.

$eventSelect.on("select2:select", function (e) { log("select2:select", e); });

$eventSelect.on("change", function (e) { log("change"); });

Can anyone tell me how I can make this work?

+3


source to share


4 answers


I am using select2 version 3.3.2 and the following code works for me



$("#id").on("change", function () { debugger; });
+5


source


You can try to declare the event after you know the webpage is fully loaded, in my case that was the problem:



$(document).ready(function(){
    $('#yourselect').on("select2:select", function(e) { 
        console.log($(this).val());
    });
});
Run codeHide result


+1


source


Try this code

$eventSelect.select2().on("change", function(e) {
          // mostly used event, fired to the original element when the value changes
          log("change val=" + e.val);
        })
0


source


I see that you took your code from select2 documentation:

https://select2.github.io/examples.html#programmatic-control

You noticed that they define the function below this code using the log () method.

Here is the function code, did you include that as well?

function log (name, evt) {
  if (!evt) {
      var args = "{}";
  } else {
      var args = JSON.stringify(evt.params, function (key, value) {
      if (value && value.nodeName) return "[DOM node]";
      if (value instanceof $.Event) return "[$.Event]";
      return value;
      });
  }
  var $e = $("<li>" + name + " -> " + args + "</li>");
  $eventLog.append($e);
  $e.animate({ opacity: 1 }, 10000, 'linear', function () {
      $e.animate({ opacity: 0 }, 2000, 'linear', function () {
          $e.remove();
      });
    });
}

Alternatively, you can use console.log () to output to the console.

0


source






More articles:


All Articles