[英]Disable button when no option is selected from dropdown
I have an input type button (it can not be submit type because it triggers a secondary action inside a form) that I need to maintain disabled if no selection made on a previous dropdown selector. 我有一个输入类型按钮(它不能提交类型,因为它触发了表单内的辅助动作),如果在上一个下拉选择器上没有选择,我需要保持禁用状态。 I have unsuccessfuly tried: this , this , this , and some others...
我尝试失败了: this , this , this和其他一些...
here it is my form code : 这是我的表单代码:
echo "<select class='corpusname' id='corpusname' size='1' name='corpusname' required />
<option value=''>Select a corpus</option>";
// This query gives the other options from a database
$result = mysqli_query($db, "SELECT * FROM corpus_info") or die(mysqli_error($db));
while($cpsmlg = mysqli_fetch_array($result)){
echo "<option value='".$cpsmlg['corpus']."'>".$cpsmlg['title']."</option>";
}
echo "</select>
<a id='theLink' target='_blank'>
// This is the button to be disabled
<input type='button' id='seedoc' class='seedoc' value='See doc' /></a>";
Just add an onchange
event to the select
. 只需向
select
添加一个onchange
事件。
function enableButton() { var selectelem = document.getElementById('corpusname'); var btnelem = document.getElementById('seedoc'); btnelem.disabled = !selectelem.value; }
<select class='corpusname' id='corpusname' size='1' name='corpusname' required onchange="enableButton()"/> <option value=''>Select a corpus</option> <option value="1">1</option> </select> <input type="button" id="seedoc" disabled value="Submit">
Here is a little snippet without the php part, the php part is still the same. 这里是没有php部分的小片段,php部分仍然相同。
function ValidateDropDwon(dd){ var input = document.getElementById('seedoc') if(dd.value == '') input.disabled = true; else input.disabled = false; }
<select class='corpusname' id='corpusname' size='1' name='corpusname' required onchange="ValidateDropDwon(this)"> <option value=''>Select a corpus</option> <option value='test'>test</option> </select> <input type='submit' id='seedoc' class='seedoc' disabled value='See doc' />
since you list jQuery
I will use that here. 因为您列出了
jQuery
所以我将在这里使用它。
echo "<select class='corpusname' id='corpusname' size='1'
name='corpusname' required onChange='enableButton()' />
<option value=''>Select a corpus</option>";
// This query gives the other options from a database
$result = mysqli_query($db, "SELECT * FROM corpus_info") or die(mysqli_error($db));
while($cpsmlg = mysqli_fetch_array($result)){
echo "<option value='".$cpsmlg['corpus']."'>".$cpsmlg['title']."</option>";
}
echo "</select>
<a id='theLink' target='_blank'>
// This is the button to be disabled
<input type='button' id='seedoc' class='seedoc' disabled value='See doc' /></a>";
then some javascript on the page to accomplish the onchange()
然后页面上的一些javascript完成
onchange()
<script type="text/javascript">
function enableButton(){
$("#seedoc").prop('disabled', false);
}
</script>
I would put in a check, if corpusname = ''...
but it will not ever be changed back to a ''
, so onChange()
should suffice. if corpusname = ''...
,我会进行检查,但是它永远不会变回''
,因此onChange()
应该足够了。
If You have Jquery Included , You Can use this (EASIEST) : 如果您具有jQuery,则可以使用以下(EASIEST):
$('#corpusname').on("change",function(){
if($(this).val() == ''){
$('#seedoc').attr('disabled','disabled'); //Disables if Values of Select Empty
}else{
$('#seedoc').removeAttr('disabled');
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.