How to change value from one Select to another?
Question
I have two Selects with several options in html code:
<select name="t" id="t">
<option value="0">Overall</option>
<option value="1">t_name</option></select>
<select name="m" id="m">
<option value="0">back to Overall</option>
<option value="1">m_some</option></select>
And my question is how to force change value from first Select named "t" to "0" (Overall) only in the case when user chosen value "0" (back to Overall) in second Select named "m"? And submit form at the end.
--EDIT--
Now because of advices I tried do that in this way:
<script>
$(function(){
$('#m, #t').change(function(){
if($('#m').val() == '0')
$('#t').val('0').change();
$('form#myform').submit();
});
});
</script>
And this script submits the form everytime when I change Select "m" or "t", except situation when I change Select "m" to value "0" (script only changes "t" to "0" in correct way without submit). Why?
4 answers
solution1
1 2011-10-20 10:19:07
<html>
<body>
<form name="form1" id="form1">
<select id="t" name="t" onchange="this.form.submit();">
<option value="0">Overall</option>
<option value="1">t_name</option>
</select>
<select name="m" onchange="setposition(this.value)">
<option value="0">back to Overall</option>
<option value="1">m_some</option>
</select>
</form>
</body>
</html>
<script language="javascript" type="text/javascript">
function setposition(svalue) {
if (svalue == "0") {
document.getElementById("t").options[1].selected = true;
}
}
</script>`enter code here`
solution2
0 2011-10-20 09:37:18
$('select[name="m"]').change(function() {
if($(this).val() == '0') {
$('select[name="t"]').val('0');
}
});
Besides that, you should use jQuery to set the onchange events instead of doing so via inline JS:
$('select[name="t"], select[name="m"]').change(function() {
$(this).closest('form').submit();
// if you do not need any jquery submit events,
// you can also use this.form.submit();
});
See http://jsfiddle.net/ThiefMaster/NfVQZ/ for a demo.
solution3
0 ACCPTED 2011-10-20 09:40:43
You should be using ID's as below as they are easier on DOM searching.
<select name="t" id="t" onchange="this.form.submit();">
<option value="0">Overall</option>
<option value="1">t_name</option></select>
<select name="m" id="m" onchange="this.form.submit();">
<option value="0">back to Overall</option>
<option value="1">m_some</option></select>
<script>
$(function(){
$('#m, #t').change(function(){
//don't forget to trigger the change event
if($('#m').val() == '0')
$('#t').val('0').change();
$('form#form_id').submit();
});
});
</script>
solution4
0 2011-10-20 09:41:03
You could do something like that:
$(function(){
$('[name="t"],[name="m"]').change(function(){
if($(this).attr('name')=='m') && $(this).val()=='0'){
$('[name="t"]').val('0');
}
$(this).closest('form').submit();
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.