Jquery chosen multiple select, How to get selected values server side in asp.net?

Question

I am revitalizing a very old application and trying not to introduce Devexpress or Telerik into this application.

I have a need for some dropdownlists with multiple selection availability. I have poked around on the web and the chosen jquery plugin looks to be the route to go.

I have it implemented in one of my test pages, but I am trying to get this implemented rather quickly without much tooling around with it. I am having some difficulties grabbing the multiple selected values on the server side in my code behind. I don't really want to have a bunch of client side functionality holding and maintaining data on change etc.

Any one ever attempt to get at this data server side versus client side and have luck?

Code example. :

<select id="slcExample" multiple class="chosen-select" style="width:350px;" runat="server"></select>

<script type="text/javascript">
        $(document).ready(function () {
            var config = {
                '.chosen-select': {},
                '.chosen-select-deselect': { allow_single_deselect: true },
                '.chosen-select-no-single': { disable_search_threshold: 10 },
                '.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
                '.chosen-select-width': { width: "95%" }
            }
            for (var selector in config) {
                $(selector).chosen(config[selector]);
            }
        });
  </script>

I have found that if I could get at this property .SelectedIndices that I would have access to the selected values but it will not let me use this on the server side as it is a protected property of the select in asp.net.

You have 806 rep. I'd have thought you know how to structure a question. Please provide some code (your controller method and markup). What have you tried so far? — reggaemahn
– reggaemahn, Commented Aug 14, 2013 at 13:35
Code added, it is not a controller as this not mvc this is an old webforms application. I have tried accessing on the server side but it only has the first value selected. I really don't want to have to do a bunch of client side coding which i could do but it will take time. — Bill Blankenship
– Bill Blankenship, Commented Aug 14, 2013 at 13:39
Try giving your select a name, say 'mySelect' and then in your server class grab it as a string array. e.g. public ActionResult(string[] mySelect){} — reggaemahn
– reggaemahn, Commented Aug 14, 2013 at 13:41
Thanks for the suggestion, but this is not MVC, it is WebForms, no actionresults present. — Bill Blankenship
– Bill Blankenship, Commented Aug 14, 2013 at 13:44

Bill Blankenship · Accepted Answer · 2013-08-14 14:27:06Z

1

Here is what I ended up doing. :

        Dim index As Integer
        Dim valuesChosen As String = ""
        For index = 0 To (slcExample.Items.Count - 1)
            If (slcExample.Items(index).Selected) Then
                valuesChosen += slcExample.Items(index).Value.Trim + ";"
            End If
        Next

I needed something on the server side. Hopefully this helps someone else. If you have a better option I am open to seeing it and will mark as answer if better.

answered Aug 14, 2013 at 14:27

Bill Blankenship

3,3667 gold badges46 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Hemadeus · Accepted Answer · 2013-08-14 14:18:09Z

0

You can create a hidden field with asp:net class. with a javascript method, add all value in a comma separated list.

You can have the list on the server side after submiting your form.

try putting clientIDMode="Static"

<asp:HiddenField runat="server" ID="hidTest" ClientIDMode="Static" />

but if you can't, you will have to see the generated name from asp to update it in your javascript method

<script type="text/javascript">
        $(document).ready(function () {
            var config = {
                '.chosen-select': {},
                '.chosen-select-deselect': { allow_single_deselect: true },
                '.chosen-select-no-single': { disable_search_threshold: 10 },
                '.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
                '.chosen-select-width': { width: "95%" }
            }
            var hiddenSeparatedList = "";
            for (var selector in config) {
                hiddenSeparatedList += $(selector).chosen(config[selector]) + ','
                $('#hidTest').val(hiddenSeparatedList);
            }
        });
  </script>

edited Aug 14, 2013 at 14:18

answered Aug 14, 2013 at 14:10

Hemadeus

4721 gold badge8 silver badges20 bronze badges

3 Comments

Bill Blankenship Over a year ago

That is a valid solution but that is exactly what I don't want to do is maintain a list on the clientside as stated in the question. Then I have to maintain that list of items over time on the clientside if one is added or removed prior to say a save button being hit.

Hemadeus Over a year ago

Ok the only way I've done that is always keeping a list on the javascript side that each time you add one, you update the list..

Bill Blankenship Over a year ago

Very valid way of doing this, just more work than I want to do. I have done the same. Have to get this app out the door though quick.

Bonnie White · Accepted Answer · 2014-03-28 17:15:38Z

0

I had the same problem and switched to this JQuery plugin instead: http://www.erichynds.com/blog/jquery-ui-multiselect-widget

Since the asp.net dropdown control does not allow multiple items, I used a regular tag with runat server and an ID. The plugin actually selects the items and then you can read them from code behind.

The plugin will works client-side on the asp.net dropdown, but you can't get the selected items in the code behind. So depending on your needs .. .

Hope this helps! Bonnie

answered Mar 28, 2014 at 17:15

Bonnie White

1

Comments

Tracy · Accepted Answer · 2016-05-13 19:47:32Z

0

I used a List instead:

        int i;
        IList<string> chosenItems = new List<string>();
        for (i = 0; i <= selectExample.Items.Count - 1; i++)
        {
            if (selectExample.Items[index].Selected)
            {
                chosenItems.Add(selectExample.Items[index].Value.Trim());
            }
        }

answered May 13, 2016 at 19:47

Tracy

1

Collectives™ on Stack Overflow

Jquery chosen multiple select, How to get selected values server side in asp.net?

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related