Select dropdown options using jQuery
Finally an update to my Select box manipulation collection of plugins for jQuery. You can select options that match a given string or regular expression. The original code for this particular plugin was created by Mathias Bank, with a modification by me to use a regular expression as a parameter as well as a string. He wrote it over a month ago, but I have only just got round to implementing it.
Comments
this.options.add(option);
Changing it to:
this.options[this.length] = option;
works in Safari as well. Hope this helps!
Oli.
This plugin is quit usefull. Thank you for it.
I needed to sort options after retrieving them via ajax. So i added an option to the ajaxAddOption function to call a function after completion.
Here is my change:
/**
* Add options via ajax
*
* @name ajaxAddOption
* @author Sam Collett ( http://www.texotela.co.uk )
* @type jQuery
* @param String url Page to get options from ( must be valid JSON )
* @param Object params ( optional ) Any parameters to send with the request
* @param Boolean select ( optional ) Select the added options, default true
* @param Function fn ( optional ) call this function with the select object as param after completion
* @example $ ( "#myselect" ) .ajaxAddOption ( "myoptions.php" ) ;
*
*/
$.fn.ajaxAddOption = function ( url, params, select, fn )
{
if ( typeof url != "string" ) return this;
if ( typeof params != "object" ) params = { } ;
if ( typeof select != "boolean" ) select = true;
this.each (
function ( )
{
var self = this;
$.getJSON ( url,
params,
function ( r )
{
$ ( self ) .addOption ( r, select ) ;
if ( typeof fn == "function" ) fn.call ( self ) ;
}
) ;
}
)
return this;
}
/**
* Add options via ajax
*
* @name ajaxAddOption
* @author Sam Collett ( http://www.texotela.co.uk )
* @type jQuery
* @param String url Page to get options from ( must be valid JSON )
* @param Object params ( optional ) Any parameters to send with the request
* @param Boolean select ( optional ) Select the added options, default true
* @param Function fn ( optional ) call this function with the select object as param after completion
* @param Array args ( optional ) array with params to pass to the function afterwards
* @example $ ( "#myselect" ) .ajaxAddOption ( "myoptions.php" ) ;
*
*/
$.fn.ajaxAddOption = function ( url, params, select, fn, args )
{
if ( typeof url != "string" ) return this;
if ( typeof params != "object" ) params = { } ;
if ( typeof select != "boolean" ) select = true;
this.each (
function ( )
{
var self = this;
$.getJSON ( url,
params,
function ( r )
{
$ ( self ) .addOption ( r, select ) ;
if ( typeof fn == "function" ) {
alert ( typeof args ) ;
if ( typeof args == "object" ) {
fn.apply ( self, args ) ;
} else {
fn.call ( self ) ;
}
}
}
) ;
}
)
return this;
}