[Select2] MultiSelect -- Options for Platform v10+ and SilkUI Liverpool

[Select2] MultiSelect -- Options for Platform v10+ and SilkUI Liverpool

  
Forge Component
(2)
Published on 2015-06-29 by Eduardo Luís
2 votes
Published on 2015-06-29 by Eduardo Luís

Using the Personal Environment/Development Mode, Platform 10.0.707 in the Cloud.  

Looking for options on a DropDown List with Multiple Selections.  Looking for a list that more overtly advertises the selected item(s).  The OS ListBox also has as issue fitting the text into the box vertically and ideally would like a select all / select none option.

The (Fancy) MultiSelect from the forge has the select all and select none but does not behave in SilkUI/Liverpool.  The OS Select2 component requires a lot of clicking to get items selected.  The Select2 component from the Forge is not compatible with OS Platform 10.

Other options or ideas...

PS - it can be difficult to find solutions in the Forge, if nothing else, it is overly time consuming.


Why you say that the multiselect does not behave in SILK?

Filipe Lourenço wrote:

Why you say that the multiselect does not behave in SILK?

MultiSelect (and Chosen also) perform similarly with the list box cut off.
See the attached screen shot, the MultiSelect is on the left and the Chosen is on the right; both above the 'Advanced Filters' container.  I added a button and tied to a Ajax Refresh of the container holding the two list boxes and clicking the button causes the refresh and both the MultiSelect and Chosen list boxes work as expected.

The OML is straight drag and drop and both the MultiSelect and Chosen work as expected in the London Theme.  

Solution

So, your problem is the width, right? If it is please insert in the css stylesheet the following instruction 


SyntaxEditor Code Snippet

.chosen-container
{
    width: 100% !important;
} 

Notice that the class 'chosen-container' must be in the select

If not try to save the html with the css stylesheets and zip to me.

Solution

Filipe Lourenço wrote:

So, your problem is the width, right? If it is please insert in the css stylesheet the following instruction 


SyntaxEditor Code Snippet

.chosen-container
{
    width: 100% !important;
} 

Notice that the class 'chosen-container' must be in the select

If not try to save the html with the css stylesheets and zip to me.

Thanks for the help, that corrects the issue for Chosen with a SilkUI based theme.

Thanks again...