admin管理员组文章数量:1026166
is it possible to change the limit the value of the dropdown2 when the dropdown1 changes? here is my code
<!--DROPDOWN 1-->
<p class="">From</p>
<select name="From" id="From" onChange="displayVal(this)">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
<!--DROPDOWN 2-->
<p class="">To</p>
<select name="To" id="To">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
I want is when I change dropdown1 to none the dropdown2 option will only show none and no other more.
And I also want is if I change the value of dropdown1 to an amount, for example 30000, dropdown2 will show only the values that are greater that 30000 including the option any.
Is there a way to do this in javascript or jQuery?
sorry. I'm new at javascript and jQuery.. Thank you in advance!
is it possible to change the limit the value of the dropdown2 when the dropdown1 changes? here is my code
<!--DROPDOWN 1-->
<p class="">From</p>
<select name="From" id="From" onChange="displayVal(this)">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
<!--DROPDOWN 2-->
<p class="">To</p>
<select name="To" id="To">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
I want is when I change dropdown1 to none the dropdown2 option will only show none and no other more.
And I also want is if I change the value of dropdown1 to an amount, for example 30000, dropdown2 will show only the values that are greater that 30000 including the option any.
Is there a way to do this in javascript or jQuery?
sorry. I'm new at javascript and jQuery.. Thank you in advance!
- you should accept answers for your previous questions if they've helped you. – mcknz Commented Sep 22, 2012 at 6:04
- o yeah.. thanks.. I always forget that.. =) – Kevin Steve Maningo Commented Sep 22, 2012 at 6:07
3 Answers
Reset to default 4Demo: http://jsfiddle/LsaLA/1/
Code:
function setTo() {
var f = $('#From').val();
var t = $('#To');
t.children().hide();
if( f == 'none' ) {
t.children('[value="none"]').show();
t.val('none');
}
else if( t == 'any' ) {
t.children().show();
t.val('any');
}
else {
f = parseInt(f, 10);
t.children().each(function() {
if( $(this).val() == 'any' ) {
$(this).show();
t.val('any');
}
else {
var v = parseInt($(this).val(), 10);
if(!isNaN(v) && v >= f) {
$(this).show();
}
}
});
t.val('any');
}
}
$('#From').change(setTo);
//call it on load as well
setTo();
try this: http://jsfiddle/F6xnL/4/
$("#From").change(function() {
$("#To").attr("disabled", false).children().each(function() {
$(this).attr('disabled', false);
});
if ($(this).val() === 'any') return;
if ($(this).val() === 'none') {
$("#To").val("none").attr("disabled", true);
return;
}
var pound = parseInt($(this).val());
$("#To").children().each(function() {
var val = $(this).val();
if (val === 'none' || val === 'any') {
$(this).attr('disabled', true); return;
}
if (parseInt($(this).val()) <= pound) {
$(this).attr('disabled', true);
}
});
});
$('#From').change(function(){
if($(this).val() == 'none'){
$('#To').prop('disabled', true);
}else if((true == $('#To').prop('disabled')) && ($(this).val() != 'none')){
$('#To').prop('disabled', false);
}
$('#To option').each(function(){
if($(this).val() < $('#From').val()){
$(this).hide(0);
}else{
if($(this).css('display') == 'none'){
$(this).show(0);
}
}
});
});
Untested, but this should work. I'm a bit verbose.
is it possible to change the limit the value of the dropdown2 when the dropdown1 changes? here is my code
<!--DROPDOWN 1-->
<p class="">From</p>
<select name="From" id="From" onChange="displayVal(this)">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
<!--DROPDOWN 2-->
<p class="">To</p>
<select name="To" id="To">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
I want is when I change dropdown1 to none the dropdown2 option will only show none and no other more.
And I also want is if I change the value of dropdown1 to an amount, for example 30000, dropdown2 will show only the values that are greater that 30000 including the option any.
Is there a way to do this in javascript or jQuery?
sorry. I'm new at javascript and jQuery.. Thank you in advance!
is it possible to change the limit the value of the dropdown2 when the dropdown1 changes? here is my code
<!--DROPDOWN 1-->
<p class="">From</p>
<select name="From" id="From" onChange="displayVal(this)">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
<!--DROPDOWN 2-->
<p class="">To</p>
<select name="To" id="To">
<option value="any">Any</option>
<option value="none">None</option>
<option value="10000">£10,000</option>
<option value="20000">£20,000</option>
<option value="30000">£30,000</option>
<option value="40000">£40,000</option>
<option value="50000">£50,000</option>
<option value="60000">£60,000</option>
<option value="70000">£70,000</option>
<option value="80000">£80,000</option>
<option value="90000">£90,000</option>
<option value="100000">£100,000</option>
<option value="110000">£110,000</option>
<option value="120000">£120,000</option>
<option value="130000">£130,000</option>
<option value="140000">£140,000</option>
<option value="150000">£150,000</option>
<option value="150001">£150,000+</option>
</select>
I want is when I change dropdown1 to none the dropdown2 option will only show none and no other more.
And I also want is if I change the value of dropdown1 to an amount, for example 30000, dropdown2 will show only the values that are greater that 30000 including the option any.
Is there a way to do this in javascript or jQuery?
sorry. I'm new at javascript and jQuery.. Thank you in advance!
- you should accept answers for your previous questions if they've helped you. – mcknz Commented Sep 22, 2012 at 6:04
- o yeah.. thanks.. I always forget that.. =) – Kevin Steve Maningo Commented Sep 22, 2012 at 6:07
3 Answers
Reset to default 4Demo: http://jsfiddle/LsaLA/1/
Code:
function setTo() {
var f = $('#From').val();
var t = $('#To');
t.children().hide();
if( f == 'none' ) {
t.children('[value="none"]').show();
t.val('none');
}
else if( t == 'any' ) {
t.children().show();
t.val('any');
}
else {
f = parseInt(f, 10);
t.children().each(function() {
if( $(this).val() == 'any' ) {
$(this).show();
t.val('any');
}
else {
var v = parseInt($(this).val(), 10);
if(!isNaN(v) && v >= f) {
$(this).show();
}
}
});
t.val('any');
}
}
$('#From').change(setTo);
//call it on load as well
setTo();
try this: http://jsfiddle/F6xnL/4/
$("#From").change(function() {
$("#To").attr("disabled", false).children().each(function() {
$(this).attr('disabled', false);
});
if ($(this).val() === 'any') return;
if ($(this).val() === 'none') {
$("#To").val("none").attr("disabled", true);
return;
}
var pound = parseInt($(this).val());
$("#To").children().each(function() {
var val = $(this).val();
if (val === 'none' || val === 'any') {
$(this).attr('disabled', true); return;
}
if (parseInt($(this).val()) <= pound) {
$(this).attr('disabled', true);
}
});
});
$('#From').change(function(){
if($(this).val() == 'none'){
$('#To').prop('disabled', true);
}else if((true == $('#To').prop('disabled')) && ($(this).val() != 'none')){
$('#To').prop('disabled', false);
}
$('#To option').each(function(){
if($(this).val() < $('#From').val()){
$(this).hide(0);
}else{
if($(this).css('display') == 'none'){
$(this).show(0);
}
}
});
});
Untested, but this should work. I'm a bit verbose.
本文标签： javascriptonChange event on two select optionStack Overflow
版权声明：本文标题：javascript - onChange event on two select option - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745625443a2159830.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论