Questions tagged [multi-select]

Multiselect is an exceptional and advanced feature in a user interface that empowers users to choose multiple items simultaneously within an items control. An items control could encompass various interactive components like a collapsible menu, spreadsheet columns, or even a specialized display of personalized recommendations.

What is the process of activating the select all capability in the material-ui/SelectField component?

Link to Documentation I am currently referring to the provided documentation in order to incorporate the Select-field component. However, I have not been able to locate information on how to implement a "select all" feature within this component. Import s ...

re-establishing multiple selections in a dropdown menu in PHP/HTML

Hey, I've got this multi-select listbox... <select id="extfeat" name="extfeat[]" size="6" multiple=""> <option value="Wheel_Chair Accessible">Wheel Chair Accessible</option> <option value="Fruit_Trees">Fruit Trees& ...

Angular 6 presents a challenge in rendering data within the multi select drop down feature

I am currently utilizing a multi-select library called ng-multiselect-dropdown in my Angular v6 project. Unfortunately, when I try to display my list using the multiSelect feature, the drop-down shows a message saying "No data available". I discovered th ...

Creating an observer for a multiple selection dropdown in Aurelia: step by step tutorial

In my current setup, I have a dropdown menu that allows users to select a single option. This selection automatically provides me with the filtering value as an observable. Here is how it works: public months: any=[]; @observable public selectedMonth: ...

Steps for setting two items as default selected in a multiselect dropdown

My code snippet below is meant to populate a multiselect dropdown with item values 1 and 2 as default selected, however, only item value 2 ends up being selected: $.ajax({ type: "POST", url: Url_function, data: para_datas, ...

Problem with Bootstrap multiselect: it only opens the first time, and stops working after an ajax call

I am having trouble using Bootstrap multiselect with jQuery ajax. When I run the ajax code, the multiselect button stops working properly. To see the issue in action, click here: and look at the last multiselect dropdown. Here is the ajax code snippet: ...

Binding Vue MultiSelect Checkboxes to Data Model

The data properties of the multi-select component are not updating when changed. The checkboxes are not being updated on the front-end. Expected Behavior: The checkboxes should get ticked when clicked. Link to code: https://jsfiddle.net/bzqd19nt/3/ < ...

Ensure that the dropdown remains open at all times when using the angular2-multiselect-dropdown package

I am currently implementing the angular2-multiselect-dropdown in my Angular application. This dropdown is being used within a popup. What I am trying to achieve is that when a button is clicked, the popup should display the dropdown in an open mode witho ...

Utilizing Axios for Vue Multiselect on select/enter Event

I have successfully implemented a Vue Multiselect feature that retrieves options from my database using an axios call. This functionality works great as it allows users to select existing options or add new ones to create tags. While this setup is working ...

Deactivate an option within an angularjs multi-select menu

Currently, I am utilizing an angularjs multiselect box which is displayed below: https://i.stack.imgur.com/w6ffN.png Here is the html code snippet: <select multiple ng-options="Language.LangID as Language.LangName for Language in AllLanguages " ng-mo ...

Difficulty with CasperJS multi-select functionality

I am currently attempting to utilize CasperJS for choosing both options in a multiple select within an HTML form: <select id="bldgs" name="bldgs" multiple="multiple" size="6" autocomplete="off"> <option value="249759290">Southeast Financia ...

How can we reset multiple selected values (mui chips) in a React Material-UI Autocomplete field when changing the value in a different field?

Is there a way to clear the mui-chips in Material UI Autocomplete TextField when the value in another field is changed? I have been struggling with clearing the subtype value when the Type value changes. Although I can update the drop-down options based on ...

What is the process for implementing ng-required in a MultiSelect component?

When using the searchable-multiselect in angular js, I've come across an issue where ng-required=true is not working in the multiselect. Does anyone know how to apply ng-required in MultiSelect? <searchable-multiselect display-attr="name" selected ...

Unable to dynamically populate Bootstrap select with real-time search and multiple options using jQuery

How can I dynamically populate a select statement with options retrieved from PHP code? <select name='friends[]' id='friends' class='selectpicker show-tick form-control' data-live- search='true' multiple> <!-- options here --> < ...

Clearing selections from a multiple-choice input field

I am seeking to implement a delete feature in a multi-select element similar to the functionality seen here on stackoverflow when selecting multiple tags for a question. Once an item is selected, I would like to display a close icon next to it so that user ...

Dropdown with multiple selections closes after making only one selection

Currently, I have a multi-select dropdown feature where users can list and select multiple items at once. Here is the code snippet I am utilizing for this functionality: <Multiselect v-model="abc" valueProp="x ...

A versatile multi-select jQuery widget featuring the ability to choose options within a specific opt

I am on the hunt for a cool jQuery tool that has the following characteristics: It enables you to create multiple groups, such as: Group 1 - Sub 1 1 - Sub 1 2 - Sub 1 3 Group 2 - Sub 2 1 Group 3 - Sub 3 1 - Sub 3 2 By clicking on Group 1, for instance, ...

Tips for Implementing the jquery.Validate Plugin with a jquery.multiselect Dropdown

Let's talk about a predicament I'm facing: trying to integrate a dropdown box into a form that already makes use of the jquery.validate plugin along with other fields that currently validate correctly. The dropdown box is being added using the jq ...

Vue Multiselect: Leveraging nested objects for custom options

I have been working with the Vue Multiselect Custom Option Template and I am trying to use the name property as customLabel. Typically, this would be a straightforward task by just using 'name', but in this scenario, the property I need is nested ...

Issue with Vue Multiselect auto-suggestion functionality

I've been utilizing the [vue-multiselect] library for my project. [1]: https://www.npmjs.com/package/vue-multiselect. Within a form, I have multiple multiselect dropdowns. The issue I'm facing is with the browser's autocomplete feature. I&a ...

Troubles with the compatibility of javascript and jquery's multiselect plugin

I've been utilizing the multiselect API to create a dropdown with multiple select options. This is my HTML code: <select id="options" multiple="multiple"></select> And this is my JS code: render:function(){ // $('#viewTemp').html(oct ...

Using Vue-Multiselect in conjunction with Laravel 5.3

I am relatively new to utilizing Laravel and Vue, and I require assistance with integrating Vue-Multiselect. I am unsure about how to transmit the actual options to the select component. Here is my Vue file: <template> <div class="dropdown" ...

Having issues when dynamically adding options to a multiselect dropdown

I'm working on dynamically adding options to a multiselect using AJAX: <select size='2' name="CraftCode" id=@ccrf class="form-control js-select manualentrydd" ></select> $.ajax({ type: "GET", url: "GetCraftCodes", data: { JobNum: j ...