JSFiddle - React, Tailwind, and code Playground

by Alessandro Viana

HTML

<link rel="stylesheet" href="http://ivaynberg.github.io/select2/select2-3.4.5/select2.css">
<script src="http://ivaynberg.github.io/select2/select2-3.4.5/select2.js"></script>
<input type="hidden" class="bigdrop select2-offscreen" name="cargoSelect" id="e7" tabindex="-1">
    
    <h1>funciona</h1>
    <input type="hidden" class="bigdrop select2-offscreen" name="cargoSelect" id="e7a" tabindex="-1">

JavaScript

$("#e7a").select2({
    placeholder: "Search for a movie",
    minimumInputLength: 3,
    ajax: {
        url:"http://api.rottentomatoes.com/api/public/v1.0/movies.json",
        dataType: 'jsonp',
        quietMillis: 100,
        data: function (term, page) { // page is the one-based page number tracked by Select2
            debugger;
            return {
                q: term, //search term
                page_limit: 10, // page size
                page: page,
                apikey: "ju6z9mjyajq2djue3gbvv26t" // please do not use so this example keeps working
            };
        },
      error: function(XMLHttpRequest, textStatus, errorThrown) {
          debugger;
         alert("some error");
      },
        results: function (data, page) {
            var more = (page * 10) < data.total; // whether or not there are more results available
 
            // notice we return the value of more so Select2 knows if more results can be loaded
            debugger;
            return {results: data.movies, more: more};
        }
    },
    formatResult: movieFormatResult, // omitted for brevity, see the source of this page
    formatSelection: movieFormatSelection, // omitted for brevity, see the source of this page
    dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
});

$("#e7").select2({
    placeholder: "Search for a movie",
    minimumInputLength: 3,
    ajax: {
        url:"http://lab.iesde.com.br/~alessandro.viana/aprova_questoes/perfil/buscarBancas",
        dataType: 'jsonp',
        quietMillis: 100,
        data: function (term, page) { // page is the one-based page number tracked by Select2
            debugger;
            return {
                q: term, //search term
                page_limit: 10, // page size
                page: page
            };
        },
      success:...