I'm trying to do some dynamic drop down with pre-filled array. Option1
would trigger new options in Option2. Option2 would trigger new
options in Option3. (and so on...)

In matchOptions(), I would like to use $.merge to add matched items
without duplication. But it seems that it cannot be done. So I guess I
cannot use $.merge for object?

HTML:
<select class="option1"></select>
<select class="option2"></select>
<select class="option3"></select>

Scripts (sorry it's a bit long):
var os = [ //options available
        {f1:{value:0,label:"A1"}, f2:{value:0,label:"B1"}, 
f3:{value:0,label:"C1"}},
        {f1:{value:0,label:"A1"}, f2:{value:0,label:"B1"}, 
f3:{value:1,label:"C2"}},
        {f1:{value:0,label:"A1"}, f2:{value:1,label:"B2"}, 
f3:{value:2,label:"C3"}},
        {f1:{value:1,label:"A2"}, f2:{value:2,label:"B3"}, 
f3:{value:3,label:"C4"}},
        {f1:{value:1,label:"A2"}, f2:{value:3,label:"B4"}, 
f3:{value:4,label:"C5"}},
        {f1:{value:1,label:"A2"}, f2:{value:3,label:"B4"}, 
f3:{value:5,label:"C6"}},
        {f1:{value:2,label:"A3"}, f2:{value:4,label:"B5"}, 
f3:{value:6,label:"C7"}},
        {f1:{value:2,label:"A3"}, f2:{value:5,label:"B6"}, 
f3:{value:7,label:"C8"}}
];
$(document).ready(function(){
        $("[EMAIL PROTECTED]").dynSelect({os:os});
});

//Plugins
jQuery.fn.dynSelect = function(s){
        var o = { f:"f", v:"value", l:"label", emptyMsg:"Please select...", 
os:[]};
        if(s) jQuery.extend(o,s);
        o.className = jQuery(this).get(0).className.replace(/\d+$/,"");
        this
                .each(function(i){
                        jQuery.dynSelect.fillOptions(this,o);
                })
                .change(function(){
                        var index = jQuery("[EMAIL 
PROTECTED]"+o.className+"]").index(this);
                        jQuery("[EMAIL 
PROTECTED]"+o.className+"]:gt("+index+")").each(function(){
                                jQuery.dynSelect.fillOptions(this,o);
                        });
                });
}
jQuery.dynSelect = {
        fillOptions: function(obj,o){
                var num = obj.className.replace(o.className,"");
                obj.options.length = 1;
                obj.options[0] = new Option(o.emptyMsg,null);
                jQuery(this.matchOptions(num,o)).each(function(i){
                        obj.options[i+1] = new Option(this[o.l],this[o.v]);
                });
        },
        matchOptions: function(num,o){
                var match = [];
                //try to match, e.g. option3 would match by option1 and option2
                jQuery.each(o.os,function(i){
                        var j = eval(num);
                        var isMatch = true;
                        while(--j>0){
                                
if(jQuery("select."+o.className+j).val()!=this[o.f+j][o.v]){
                                        isMatch = false;
                                        break;
                                }
                        }
                        if(isMatch){
                                match = jQuery.merge(match,[this[o.f+num]]);
                        }
                });
                return match;
        }
}
                        
-- 
Best Regards,
Jacky
http://jacky.seezone.net

_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

Reply via email to