0plus1 Blog

This is a simple function to append values to a multiselect. In the comments you’ll find the explanation of each command.

function appendMulti(value,target){
    //Get old values from multiselect (they are an array)
	oldvalues= $(target).val();
	//We need to check if the multiselect is empty
	if(oldvalues){
        //It's not empty
		//Find the lenght of the array, the beauty of this is that since arrays starts from 0, this number will always be the next available slot
		key = value.length;
	} else {
        //It's empty
		//Initialize a new array and set the key to the first element
		var oldvalues = [];
		key = 0;
	}
	//Append new value to the array
	oldvalues[key] = value;
	//Set the new values
	$(target).val(oldvalues);

	return true;
}

You can call the function like this:

appendMulti('value','#multiselect');

I’ve made this post because I got asked why this snippet gave problems:

$.ajax({
   type: "POST", url: "somepage.php",
   success: function(html){$("#someDiv").html(html).dialog();}
});

The problem with this code is that it creates a new instance of dialog each time, basically adding a new dialog div in the html for each call.
Aside from being unable to reopen the dialog after closing it, your are replicating your ajax code several times across the webpage creating all sort of problems with the jquery selectors.

The jquery-ui docs do not expalin well this issue, so to avoid headache here is the correct code:

$(function() {
   $("#someDiv").dialog({ autoOpen: false });
});

then in the ajax call:

$.ajax({
   type: "POST", url: "somepage.php",
   success: function(html){$("#someDiv").html(html).dialog('open');}
});