select2 | 易学教程

前端插件之Select2使用

阅读更多关于前端插件之Select2使用

Select2是一款基于JQuery的下拉列表插件，主要用来优化select，支持单选和多选，同时也支持分组显示、列表检索、远程获取数据等众多好用的功能项目地址： https://select2.org/ 基本使用需要用到的JS和CSS文件位于项目代码下的dist目录中，需要将这个目录中的对应文件放入你的项目里，这一步不赘述引入CSS/JS文件，由于Select2是基于Jquery的，所以要先引入Jquery，这里我们都直接引入CDN的地址  <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>  <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/css/select2.min.css" rel="stylesheet" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/js/select2.min.js"> </script> 初始化Select2 <select class="form-control" id="id_select2_demo1">

How to use Select2 with Reactjs?

阅读更多关于 How to use Select2 with Reactjs?

问题 I have dependent fields like this <List> <select> <option></option> <option></option> </select> <select> <option></option> <option></option> </select> <input /> </List> If I had 5 <List/> components.How do I add Select2 to each component.I googled online.But couldn't find any working solution. Code below for react-select .Getting error TypeError: event.target is undefined . var React = require('react'); var ReactDOM = require('react-dom'); var Select = require('react-select'); var Page =

AngularJS + select2 - How to set initial value

阅读更多关于 AngularJS + select2 - How to set initial value

问题 I want to use Select2 in my AngularJS project, So I added an input like this : <select class="find-neighborhood js-states form-control" ng-model="regionIdentifier" ng-init=""> </select> Luckily , Whenever regionIdentifier is change, I find out. Actually I want to set initial value in my Select2 . Here is my javascript code : $(".find-neighborhood").select2({ dir: "rtl", placeholder: "find neighborhood ...", allowClear: true, data: $scope.regions }); My $scope.regions looks like : [object

jQuery.map() to Parse results from select2 ajax call

阅读更多关于 jQuery.map() to Parse results from select2 ajax call

问题 I have the following select2 ajax call. How do I use the jquery $.map() to parse the returned json results. From the users array i need to get the Text and Value results. From the pager array I need to get the TotalItemCount. What I have below doesnt seem to work i.e the search results don't seem to display in the select list. No console errors are shown either so I'm not sure what Im doing wrong. var url = '@Url.Action("GetEmployees", "Employees")'; var pageSize = 20; $(".js-data-example

Set tag value on select2

阅读更多关于 Set tag value on select2

问题 I have select field on my page: <label> <span>Select name</span> <select name="name"> <option value="Option1">Option 1</option> <option value="Option2">Option 2</option> </select> </label> And I have initialized select2 lib for this field: $("[name='name']").select2({ allowClear: true, tags: true }); As you can see I need to use tags because user can write an option, not included in the proposed. And it works. When I want to set the default user value I use this command: $("[name='name']")

Updating select options after AJAX request

阅读更多关于 Updating select options after AJAX request

问题 I have select field looking like that: <?= $form->field($place, "[{$index}]id")->widget(Select2::classname(), [ 'data' => ArrayHelper::map(PresentationPlace::find()->all(), 'id', 'displaynew'), 'class' => 'field', 'options' => ['placeholder' => Yii::t('app', 'Pick place for presentation')], 'pluginOptions' => [ 'allowClear' => false ], ])->label(Yii::t('app', Yii::t('app', 'Place'))) ?> And after that field, I have short form for adding new place - you can fill it and send AJAX request. It

Select2 doesn't render properly

阅读更多关于 Select2 doesn't render properly

问题 I am attemping to add Select2 library to my project, but I am failing miserably: My code looks like this: <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <link ref="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css"> <link ref="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs

Get Last Selected Value of Select2?

阅读更多关于 Get Last Selected Value of Select2?

问题 I am using multiple options for Select2 and the data is loaded from a JSON source. As I'm not sure how to explain it exactly I'll provide an example: List Options: A B C If I choose C, then $("#select2").change(function(){ alert($(this).val()); }); Results: [C] However, If I then choose A I would get [A, C] If I then choose B I get [A, B, C] I would preferably want it to append so I would get [C, A, B]. However being able to find the last selected option would be alright. I have tried :last

jquery select 2 options not getting formatted

阅读更多关于 jquery select 2 options not getting formatted

问题 I have result of this format and could not get the options to load: can you please help me: what should result method look like? [{"id":2,"name":512843},{"id":2,"name":512844}, {"id":2,"name":512847},{"id":2,"name":512874}, {"id":2,"name":512875},{"id":2,"name":512880}, {"id":2,"name":512884},{"id":2,"name":512886}, {"id":2,"name":512887},{"id":2,"name":512888}, {"id":2,"name":512892},{"id":2,"name":512896}, {"id":2,"name":512907},{"id":2,"name":512910}, {"id":2,"name":512911},{"id":2,"name"

ajaxform select2 concatenate multiple IDs

阅读更多关于 ajaxform select2 concatenate multiple IDs

问题 I have a select2 search form with an ajaxform that concatenates new form entries into the original select2 search form. If more than one new entry is added, the new text values concatenate correctly into the search field, however, any new hidden ID replaces the existing one. It appears to be added because all new text values shows in the select2 search field. I think the issue is that the new ID should be concatenating to the hidden cropstageid field in addition to the text field