こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

条件により押せないボタンを作りたい

2つのセレクトボックスがあり、どちらも選択していれば「検索」ボタンを押せるが
どちらか1つでも選択していなければ「検索」ボタンを押せない状態にしたいのですが
どのようにすれば可能でしょうか?

<script type="text/javascript">
jQuery(function() {
jQuery('#change_btn').click(function() {
jQuery.post('price.php',
{
size : jQuery('#size').attr('value'),
days : jQuery('#days').attr('value')
},
callBack);
});
});
function callBack(data) {
jQuery('#change_area').html(data);
}
</script>

<form action="" id="form1" method="post">
<select name="size" id="size">
<option value="">---選択してください---</option>
<option value="s1">サイズ01</option>
<option value="s2">サイズ02</option>
<option value="s3">サイズ03</option>
</select>
<select name="days" id="days">
<option value="">---選択してください---</option>
<option value="d6">6日</option>
<option value="d8">8日</option>
</select>
<input type="button" id="change_btn" value="検索" />
</form>

投稿日時 - 2011-08-03 02:50:56

QNo.6917640

困ってます

質問者が選んだベストアンサー

<form action="#" id="form1" method="post">
<select name="size" id="size" onchange="hohe()">
<option value="">---選択してください---</option>
<option value="s1">サイズ01</option>
<option value="s2">サイズ02</option>
<option value="s3">サイズ03</option>
</select>

<select name="days" id="days" onchange="hohe()">
<option value="">---選択してください---</option>
<option value="d6">6日</option>
<option value="d8">8日</option>
</select>
<input type="button" id="change_btn" value="検索" disabled>
</form>
--
function hohe () {
var d = document;
var e0 = d.getElementById ('size');
var e1 = d.getElementById ('days');
var e2 = d.getElementById ('change_btn');

e2.disabled = !(e0.value && e1.value);
}

投稿日時 - 2011-08-03 21:03:46

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(2)

ANo.1

対象のボタンをdisabled(あるいは非表示)などにしておいて、セレクトボックスのonchangeイベントでセレクトボックスの値を両方チェックし、OKならボタンのdisabled設定を解除(または表示)のような処理をしてあげればよろしいかと思います。

投稿日時 - 2011-08-03 10:14:41

あなたにオススメの質問