Este artigo resume o uso do componente Bootstrap Select2 em alguns projetos reais. É compartilhado com você. Amigos necessitados podem aprender com isso e evitar desvios. O conteúdo específico é o seguinte
Imagem de reprodução:
Seja para obter dados de maneira fixa ou obter Ajax, bootstrap.js/css e select2.js/css e:
{{stylesheet_link ('css/bootstrap.css')}} {{{stylesheet_link ('css/select2.min.css')}} {{stylesheet_link ('css/font-aweome.minin.css') stylesheet_link ('css/prettify.css')}} {{javascript_include ('js/lib/jquery.js')}} {{{javascript_include ('js/lib/select2.full.js')}} {{ javascript_include('js/lib/bootstrap.js') }}<div> <section id="tags"> <div> <p> <select multiple="multiple"> <option selected="selected">orange</option> <option>white</option> <option selected="selected">purple</option> </select> </p> </div></section></div></div>Maneira fixa de obter:
$ (". }, múltiplo: true, dados: [{id: 0, text: 'story'}, {id: 1, texto: 'bug'}, {id: 2, text: 'tarefa'}]});Obtenha o método Ajax:
$ (". JS-Exemplo tags"). Select2 ({// Ative tags de etiqueta: true, // carregando dados remotos // consulte https://select2.github.io/options.html#ajax ajax: {url: "Ask2/Tags", processSults: function (DataJax Ajax: {url: "Ask2/ [];ilustrar
O formato de retorno de dados no Ajax deve se parecer com o seguinte: [{id: 0, text: 'story'}, {id: 1, texto: 'bug'}, {id: 2, text: 'tarefa'}]
Exemplo de código PHP correspondente
... $ P1 = Array (id => "1", texto => "java"); $ p2 = array (id => "2", texto => "jvm"); $ test = matriz (1 => $ P1,2 => $ P2); $ params ['Responsedata'] = $ test; $ this-> View-> desabille (); Return Parent :: AjaxResponse ($ params);
Se você ainda deseja estudar em profundidade, pode clicar aqui para estudar e anexar 3 tópicos interessantes a você:
Tutorial de aprendizado de bootstrap
Tutorial prático de bootstrap
Tutorial de uso de plug-in bootstrap
O exposto acima é uma introdução a alguns métodos de uso do Select2, espero que seja útil para o aprendizado de todos.