Question

I’ve checked the other answers and they do not seem to address this issue:

  var values = [];
            $('#EnrolledParticipants :selected').each(function (i, option) {
                values[i] = $(option).text();
            });

This returns an array with the number of elements equal to the number of selected options.

However, what I would like to do is return an array with all of the contents in the listbox, not just the selected ones.

When I do this code though:

  var values = [];
            $('#EnrolledParticipants').each(function (i, option) {
                values[i] = $(option).text();
            });

It returns an array with one element and each of the options of the list box are separated by spaces. Any idea what is different? Is there a “:any” or something similar I could try?

For additional info my ajax call looks like this:

$.ajax({
                url: '@Url.Action("SaveStudy")',
                type: "POST",
                contentType: 'application/json',
                data: JSON.stringify({
                    Participants: values,
                    StudyName: $("#StudyName").val(),
                    AssessmentID: $("input:radio:checked").val()
                }),
                success: function (result) {

                    $("#notify-container").notify("create", {
                        title: 'Update',
                        text: "Study was saved to database."
                    });

                },
                error: function () {
                    alert("No banks were selected.  Add at least one bank to create an assessment.");
                }
            });

And my controller header looks like this:

public ActionResult SaveStudy(string StudyName, string AssessmentID, string[] Participants)
        {

Thank you!

Answer 1

if #EnrolledParticipants is the select element, try simply

$('#EnrolledParticipants option').each(function (i, option) {
      values[i] = $(option).text();
});