2 dropdowns, conflicting with each other, why? [SOLVED]
I have two dropdowns which retrieve data and populate a div; the first one works fine, but the second one only works if the user goes back and manually changes the first dropdown to the initial state. Any ideas? TIA.
Here's the jquery:
-
<script>
$(document).ready(function(){
$("#selector").change(function () {
var str = "";
$("select option:selected").each(function () {
str += $(this).val();
});
$("#browseresults").load(str);
})
$("#selector2").change(function () {
var str = "";
$("select option:selected").each(function () {
str += $(this).val();
});
$("#browseresults").load(str);
})
});
</script>
Here's the HTML:
-
<select name="participants" id="selector">
<option value="">Participant</option>
<option value="URL_1">participant 1</option>
<option value="URL_2">participant 2</option>
</select>
<select name="subjectarea" id="selector2">
<option value="">subject area</option>
<option value="sub1url">subject 1</option>
<option value="sub2url">subject 2</option>
</select>