[jQuery] jQuery + Select Box woes
Hi all,
I'm having some difficulty getting select boxes to function the way I
envision them to function. I'm using the Plugin available from:
http://www.texotela.co.uk/code/jquery/select/
My code looks like the following:
----
$("select#make").change(function() {
$.ajax({
data: {make_val: $(this).val()},
dataType: 'json',
timeout: 10000,
type: 'POST',
url: "/addvehicle/models_populate",
error: function() {},
success: function(json) {
json = eval(json);
var options = '';
for (var i = 0; i < json.length; i++)
{
options += '<option value="' +
json[i]['name'].toLowerCase() + '">' + json[i]['name'] + '</option>';
}
$("select#model > option").not(".staticOpt").remove();
$("select#model").append(options);
} // end callback funct(json)
}); // end $.ajax
}); // end $("select#make)
// populate the trims select when model is changed.
$("select#model").change(function() {
$.ajax({
data: {model_val: $(this).val()},
dataType: 'json',
timeout: 10000,
type: 'POST',
url: "/addvehicle/trims_populate",
error: function() {},
success: function(json) {
json = eval(json);
var options = '';
for (var i = 0; i < json.length; i++)
{
options += '<option value="' +
json[i]['name'].toLowerCase() + '">' + json[i]['name'] + '</option>';
}
if(json.length === 0) {
$("select#trim").append('<option value="no trim">No
Trim</option>');
$("select#trim").selectOptions("No Trim");
}
else {
$("select#trim > option").not(".staticOpt").remove();
$("select#trim").append(options);
}
} // end callback funct(json)
}); // end $.ajax
}); // end $("select#model")
---
Essentially, what I'm trying to achieve is to populate a Model box
based on a Make box. At the same time, I want to populate a Trim
select box with "No Trim" if /addvehicle/trims_populate comes back
with a zero length json object.
What happens here though, if I change my 'Model' box, trims populate
just -fine-. However, when I change my Make select, it populates the
Trim boxes with different 'Models' where it should be populating it
with Trims. I need to change a 'Model' again to populate it with the
proper trims. I know it's rather confusing, and I appreciate it if
anyone can give me any hints.
Cheers all,
- sf