Unable to Use Multiple with SelectList and Blazorise v.1.0.0

[Keltanis]

Describe the bug Upgraded to Blazorise 1.0.0 in order to utilize the Multiple option for the SelectList component. However, when rendered, I still am only able to select one item. Below is my SelectList code.

Code The following is in a foreach loop:

<SelectList TItem="string"
    TValue="string"
    Data="@t.AcceptableValues.ToList()"
    TextField="@((item) => item.ToString())"
    ValueField="@((item) => item.ToString())"
    Multiple="true"
    SelectedValue="t.SelectedValue"
    SelectedValueChanged="(value) => OnTagChanged(t.Id, value)" />

Expected behavior Everything works as expected and the values populate correctly. However, unable to select more than one option.

[stsrki]

Can you inspect <select> options in devtools and see what value attribute they have?

[Keltanis]

The information for my SelectLIst for 'TagName' (See attached) in devtools is:

<div class="d-inline-block" style="margin:3px; width:160px" _bl_177="">
    <label class="font-weight-bold">TagName</label>
    <br>
    <select class="custom-select is-invalid" multiple="" _bl_218="">
        <option value="Predator">Predator</option>
        <option value="TagName">TagName</option>
        <option value="USMC">USMC</option>
    </select>
 </div>

The result looks like:

However, it should work something as seen at: https://www.codehim.com/demo/bootstrap-multiselect-dropdown/

which looks like:

[stsrki]

The first images are showing the expected selection in multiple modes. The second example with checkboxes is not what we currently have, and in fact, is not what official bootstrap supports. The link you posted is leading to an external library that uses JQuery which we don't support. Maybe at some point in the future, we could think of adding checkbox support, but only if it is possible with Blazor or native JavaScript, without JQuery.

[Keltanis]

MudBlazor seems to have a Multiselect option https://www.mudblazor.com/components/select#multiselect

Is this using JQuery? Just trying to find the best possible solution for customer and given that we have 10-30 dropdowns on a page, having them be an open list vs. a dropdown makes it difficult to swallow. :-)

[stsrki]

It's not the problem in JavaScript but in JQuery. It is too large of a dependency that not everyone would want to have included in the project. Also, we're using a regular HTML <select> element that is very limited to be customized. MudBlazor basically recreates "select" by using divs. This works visually but it is not good semantically. An example in the image:

---

Have you tried our Autocomplete for multi-select components?

[David-Moreira]

@Keltanis have you tried the proposed component by @stsrki, our AutoComplete?

[Keltanis]

I hav tried the AutoComplete, but it is not the experience the customer was looking for. They would rather not have multi-select than to go that route.

[David-Moreira]

Hello, Can we ask what your client didn't like about Autocomplete? Is it something we can improve upon?

How does it differ from the SelectList with multiple selection, is it the expected look? Not having the Textbox?

We. Appreciate the critic even if its harsh, so we can keep improving... :)

[github-actions[bot]]

This is an automated message reminding that this issue is expecting the author's answer.

[stsrki]

@David-Moreira we're going to support this with #3870 ?

[David-Moreira]

So that PR introduces checkbox support. However, the OPs issue was that he needed multiple support, and we already have that with Autocomplete as suggested. He did tell us that it wasn't what the costumer expected... So I'm not sure if the issue is with not having checkboxes or something else....

Would like to find out the reasons why the component was not the expected experience...:)

[Keltanis]

Issue is not having checkbok-box like function. But it's not the only issue with Blazorise. Since per previous statements, Blazorise is keeping just basic, there are many things it casnnot do and is far from being full-featured like MudBlazor (also free). Based on the customer's asks, we will soon be scrapping Blazorise all-together and go with a more robust solution as it does not appear Blazorise wants to implement features.

---

From: "David" @.> Sent: Tuesday, July 5, 2022 2:50 PM To: "Megabit/Blazorise" @.> Cc: "Keltanis" @.>, "Mention" @.> Subject: Re: [Megabit/Blazorise] Unable to Use Multiple with SelectList and Blazorise v.1.0.0 (Issue #3685)

So that PR introduces checkbox support. However, the OPs issue was that he needed multiple support, and we already have that with Autocomplete as suggested. He did tell us that it wasn't what the costumer expected... So I'm not sure if the issue is with having checkboxes or something else....

Would like to find out the reasons why the component was not the expected experience...:)

Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.Message ID: @.***>

[stsrki]

Not sure what exactly you find non-robust since Blazorise Autocomplete is practically supporting several different selection modes, and will soon support checkboxes also. Not to mention external API read mode, free typing mode, and more.

[Keltanis]

	The whole idea of autocomplete makes the user have to know ahead of time selections vs. a drop down populated with a set of predefined choices to multi select from. A select list (or even autocomplete) that does not imitate a drop down, when the customer’s UX/UI is based on choosing options in a form is  and has at least 60% of the elements as dropdown single selections, makes the experience horrible at best. Especially when having them placed in-line with each other. It is clear that Blazorise does not care about good GUI experience and only code. This is apparent by what was stated earlier, “It's not the problem in JavaScript but in JQuery. It is too large of a dependency that not everyone would want to have included in the project. Also, we're using a regular HTML <select> element that is very limited to be customized. MudBlazor basically recreates "select" by using divs. This works visually but it is not good semantically.”The whole point is that it works without error and is visually appealing to non-programmers. Both Form AND Function need to work not just one or the other. This is why Blazorise is not robust enough. Not too mention always having to fight to have styling changes made to fit into the visual design of a given site. Not everyone wants, or should have, a bootstrap look and feel. 

 From: Mladen Macanović @.>Sent: Wednesday, July 6, 2022 4:20 AMTo: Megabit/Blazorise @.>Cc: Keltanis @.>; Mention @.>Subject: Re: [Megabit/Blazorise] Unable to Use Multiple with SelectList and Blazorise v.1.0.0 (Issue #3685)  Not sure what exactly you find non-robust since Blazorise Autocomplete is practically supporting several different selection modes, and will soon support checkboxes also. Not to mention external API read mode, free typing mode, and more.

—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you were mentioned.Message ID: @.***>

[stsrki]

Do you mean to show a dropdown when the user clicks on autocomplete? If yes, that is easily done by setting the MinLength="0".

---

Not everyone wants, or should have, a bootstrap look and feel.

This has nothing to do with Blazorise. We tend to follow the semantic guidelines for Bootstrap, Bulma, and other CSS frameworks. The "good-looking" part should be done by the designers and/or developers and based on their project needs. For example, is this looking like a regular of-the-shelf Bootstrap site https://demos.creative-tim.com/soft-ui-dashboard/pages/billing.html ? With some CSS knowledge, the UI can be customized to almost anything.

The same can be said about the Google material design. In fact, it is even harder to change the look because material design unlike other frameworks has strict design rules on how the UI/UX should behave. So in the end, even more sites look all the same.

[Keltanis]

	It is obvious that you are not understanding what is wanted, which is why we are moving away from Blazorise. I gave an example of the desired affect with a multi-select dropdown experience. You stated that you would not support this. However, because it is the look and functionality the customer is looking for, it forces us to look elsewhere for our solutions. Looking to put Blazorise behind us. Might be good for others but does not work with what we are going for. Our bad for not foreseeing needs and looking into others before starting the project. Please close this discussion as there really is not more to say. Blazorise, in this case, is definitely not the solution for our Blazor project. 

 From: Mladen Macanović @.>Sent: Wednesday, July 6, 2022 7:04 AMTo: Megabit/Blazorise @.>Cc: Keltanis @.>; Mention @.>Subject: Re: [Megabit/Blazorise] Unable to Use Multiple with SelectList and Blazorise v.1.0.0 (Issue #3685)  Do you mean to show a dropdown when the user clicks on autocomplete? If yes, that is easily done by setting the MinLength="0".

Not everyone wants, or should have, a bootstrap look and feel.

This has nothing to do with Blazorise. We tend to follow the semantic guidelines for Bootstrap, Bulma, and other CSS frameworks. The "good-looking" part should be done by the designers and/or developers and based on their project needs. For example, is this looking like a regular of-the-shelf Bootstrap site https://demos.creative-tim.com/soft-ui-dashboard/pages/billing.html ? With some CSS knowledge, the UI can be customized to almost anything. The same can be said about the Google material design. In fact, it is even harder to change the look because material design unlike other frameworks has strict design rules on how the UI/UX should behave. So in the end, even more sites look all the same.

—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you were mentioned.Message ID: @.***>

[github-actions[bot]]

This is an automated message reminding that this issue is expecting the author's answer.