Question

I would like to have a listbox where users can add items they have entered in a text input. The list should also have remove, edit functionality.

What’s the best way to do this (i.e. hardcode or is there a jquery)? I am guessing would need javascript which is fine.

How would I read all the values from JS? I want to concatenate the items with a delimiter so that I can send it via ajax

Answer 1

Here’s an example using jQuery adding all options from a listbox to a comma delimited string;

function toAllan() {
  var allanString = "";
  var allanOptions = $('.myListBox option');
  allanOptions.each(function (index) {
    allanString += $(this).val();
    if (index != allanOptions.length - 1) {
      allanString += ",";
    }
  });
  return allanString;
}

EDIT I ran across this alternative which is much cleaner IMO.

function toAllan() {
  return $('#myListBox option').map(function (index) {
      return $(this).val();
  }).get().join(',');
}

Here’s a jsFiddle demonstrating this (also includes adding and removing of elements from the list box): http://jsfiddle.net/srGz7/4/