ドロップダウンリストの値に応じてテキストボックスを無効または有効にする次のコードがあります。
これは、ドロップダウン リストからこのコードを参照する方法です。
残念ながら、コードは例外を生成しています。間違ったイベント ハンドラー、つまり OnSelectedIndexChanged を使用していると思います。どうすれば状況を改善できますか?
ドロップダウンリストの値に応じてテキストボックスを無効または有効にする次のコードがあります。
これは、ドロップダウン リストからこのコードを参照する方法です。
残念ながら、コードは例外を生成しています。間違ったイベント ハンドラー、つまり OnSelectedIndexChanged を使用していると思います。どうすれば状況を改善できますか?
1) OnSelectedIndexChangedをonchangeに置き換えます
と
2) 交換する
var DropDown_Total = document.getElementById("DropDown_Total")
と
var DropDown_Total = document.getElementById("<%= DropDown_Total.ClientID %>")
すべての getElementById に対して
3)両方のドロップダウンの(DropDown_Date.options[DropDown_Date.selectedIndex].value を (DropDown_Date.options[DropDown_Date.selectedIndex].textに置き換える)
これを試してみてください
<script type="text/javascript">
function DisableEnable() {
var DropDown_Total = document.getElementById("<%= DropDown_Total.ClientID %>")
var Textbox_Total = document.getElementById("<%= Textbox_Total.ClientID %>")
var DropDown_Date = document.getElementById("<%= DropDown_Date.ClientID %>")
var Textbox_Date = document.getElementById("<%= Textbox_Date.ClientID %>")
if (DropDown_Total.options[DropDown_Total.selectedIndex].text == "Any Amount") {
Textbox_Total.disabled = true;
}
else {
Textbox_Total.disabled = false;
}
if (DropDown_Date.options[DropDown_Date.selectedIndex].text == "Any Date") {
Textbox_Date.disabled = true;
}
else {
Textbox_Date.disabled = false;
}
}
</script>
html
<asp:TextBox runat="server" ID="Textbox_Total" />
<asp:TextBox runat="server" ID="Textbox_Date" />
<asp:DropDownList ID="DropDown_Total" runat="server" onchange="DisableEnable();">
<asp:ListItem>Any Amount</asp:ListItem>
<asp:ListItem>Exact Amount</asp:ListItem>
<asp:ListItem>Below Amount</asp:ListItem>
<asp:ListItem>Above Amount</asp:ListItem>
</asp:DropDownList>
<asp:DropDownList ID="DropDown_Date" runat="server" onchange="DisableEnable();">
<asp:ListItem>Any Date</asp:ListItem>
<asp:ListItem>Exact Date</asp:ListItem>
<asp:ListItem>Before</asp:ListItem>
<asp:ListItem>After</asp:ListItem>
</asp:DropDownList>
onchange は js によって処理されるため、OnSelectedIndexChanged
に置き換えるだけです。コードビハインドによって処理されます。onchange
OnSelectedIndexChanged
チュートリアル: DropDownList
Javascript を使用してテキスト ボックスを無効/有効にする方法
この関数では、ドロップダウンリスト ID とテキストボックス ID を js 関数のパラメーターとして渡します。
<script type="text/javascript">
function DisableEnableTxtbox(DropDown, txtbox) {
if (DropDown.options[DropDown.selectedIndex].text == "free") {
txtbox.disabled = true;
}
else {
txtbox.disabled = false;
}
}
</script>
次のコードを追加します。
<td align="center" class="line">
<asp:DropDownList ID="ddl_MonP1" runat="server" CssClass="ppup2" onchange="DisableEnableTxtbox(this,txt_MonP1);"></asp:DropDownList>
<asp:TextBox ID="txt_MonP1" runat="server" CssClass="ppup" placeholder="Subject"></asp:TextBox>
</td>