jQuery UI multiselect Widget - how obtain all checked data in a array

Question

The widget control is from: http://www.erichynds.com/blog/jquery-ui-multiselect-widget

How do I get the value/name pair from a dropdown listbox with only the checked values? The code below works but only gives me the 'value':

      var checkedIDs = $('#test').multiselect("getChecked").map(function () {
                return this.value;
      }).get();

Also once I remove all items:
      $('#test').children().remove();

And add one back:
      $('#test').append($("<option></option>").attr("value", "value1").text("text1"));

How do I check that checkbox containing the value "value1"?

UPDATE Final code: This works partially because it is only checking ONE checkbox in the loop:

//1 - grab all data that is checked
var checkedGroupInstanceIDs = $(jqRunningJobID).multiselect("getChecked").map(function () {
    return { name: $(this).next().text().trim(), value: this.value };
}).get();

//2 - clean jqRunningJobID
$(jqRunningJobID).children().remove();

//3 - add checked data back into jqRunningJobID
for (var i = 0; i < checkedGroupInstanceIDs.length; i++) {
    TraceInfo("i/checkedGroupInstanceIDs[i].value: " + i + "/" + checkedGroupInstanceIDs[i].value);
    $(jqRunningJobID).append($("<option></option>").attr("value", checkedGroupInstanceIDs[i].value).text(checkedGroupInstanceIDs[i].name + " - added back")).val(checkedGroupInstanceIDs[i].value);

    //check that checkbox back (this doesnt work either)
    //            $("select").multiselect("widget").find(":checkbox[value='"+checkedGroupInstanceIDs[i].value+"']").each(function () {
    //                this.click();
    //            }); 
}

Thank you

Answer 1

As for the first part, give this a try…

var checkedIDs = $('#test').multiselect("getChecked").map(function () {
            return {name: $(this).next().text().trim(), value: this.value};
  }).get();

That will return an array of objects. So to get the "name" (which is really the displayed text for the option) of the first selected option, you would do checkedIDs[0].name.

For the second part, try this…

$('#test').append($("<option></option>").attr("value", "value1").text("text1")).val('value1');

EDIT If all you want to do is remove any non-selected options from the list (I'm not sure what your TraceInfo function does), just use this (replace your entire "Final code" with this)

$(jqRunningJobID).children().not(':selected').remove();
$(jqRunningJobID).multiselect("refresh");