//Esta libreria requiere la existencia de un div con id:loading
(function ($) {
    $.fn.selectChain = function (options) {
        var defaults = {
            key: "id",
            value: "label"
        };

        var settings = $.extend({}, defaults, options);

        if (!(settings.target instanceof $)) settings.target = $(settings.target);

        return this.each(function () {
            var $$ = $(this);
            
            $$.change(function () {                
                var data = null;
                var depend=null;
                if (typeof settings.depend == 'string') {
                    depend=$("#"+settings.depend).val();
                }
                if (typeof settings.data == 'string') {
                    data = settings.data + '&' + this.name + '=' + $$.val()+ '&' + settings.depend + '=' + depend;
                } else if (typeof settings.data == 'object') {
                    data = settings.data;
                    data[this.name] = $$.val();
                    data[settings.depend] = depend;
                }

                settings.target.empty();

                $.ajax({
                    url: settings.url,
                    data: data,
                    type: (settings.type || 'get'),
                    dataType: 'json',
                    async:false,
                     beforeSend:function(){
                        $('#loading').html("Cargando datos...").fadeIn();
                    },
                    success: function (j) {
                        var options = [], i = 0, o = null;
                        var isSelected=false;
                        for (i = 0; i < j.length; i++) {
                            // required to get around IE bug (http://support.microsoft.com/?scid=kb%3Ben-us%3B276228)
                            o = document.createElement("OPTION");
                            o.value = typeof j[i] == 'object' ? j[i][settings.key] : j[i];

                            o.text = typeof j[i] == 'object' ? j[i][settings.value] : j[i];

                            if(j[i]['selected']!=undefined){
                                o.selected = typeof j[i] == 'object' ? j[i]['selected'] : j[i];
                                isSelected=true;
                            }
                            settings.target.get(0).options[i] = o;
                        }

			// hand control back to browser for a moment
			setTimeout(function () {
                if(isSelected){
                    settings.target
                                .find('option:first')
                                .parent('select')
                                .trigger('change');
                }else{
                    settings.target
                                .find('option:first')
                                .attr('selected', 'selected')
                                .parent('select')
                                .trigger('change');
                }
			}, 0);
                    },
                     complete:function(){
                        $('#loading').fadeOut();
                    },
                    error: function (xhr, desc, er) {
                        // add whatever debug you want here.
                        return false;
                    }
                });
            });
        });
        return true;
    };
})(jQuery);