これはコントロールのaspxコードです。ここで必要な機能は、テキストボックスの値を入力してドロップダウン値を選択するときに、ボタンを有効にする必要があるか、ボタンを無効にする必要があることです。
<div id="div1" class="panel-collapse collapse in">
<div class="form-inline">
<div class="form-group">
<label class="control-label">Part Number:</label>
<asp:TextBox type="text" class="form-control" ID="itemOne" runat="server" />
</div>
<div class="form-group">
<label>Name:</label>
<asp:TextBox type="text" class="form-control" ID="itemTwo" runat="server" />
</div>
<div class="form-group">
<label>Price:</label>
<asp:TextBox type="text" class="form-control" ID="itemThree" runat="server" />
</div>
<div class="form-group">
<label>Weight:</label>
<asp:TextBox type="text" class="form-control" ID="itemFour" runat="server" Style="width: 100px" />
</div>
<div class="form-group">
<label>Quantity:</label>
<asp:TextBox type="text" class="form-control" ID="miscItemQuantity" runat="server" Style="width: 80px" />
</div>
<div class="form-group">
<asp:DropDownList ID="dropdownList" CssClass="form-control" runat="server" Width="150" />
<%-- Items are added dynamically from the codebehind --%>
</div>
<asp:Button runat="server" ID="addItem" type="submit" Text="Add Item" CssClass="btn btn-primary pull-right"></asp:Button>
</div>
</div>
これは、1つのテキストボックスでボタンを有効または無効にしようとしたjQueryコードです。
$(document).ready(function () {
$("#<%=itemOne.ClientID%>").keyup(function () {
if ($(this).val().length > 2) {
$("#<%=addItem.ClientID%>").removeAttr('disabled');
}
else {
$("#<%=addItem.ClientID%>").attr('disabled', 'disabled');
}
}).trigger('keyup');
});
私はどんな解決策も受けてとてもうれしいです。
あなたはこのようなものを探していると思います。まず、リスナーを各TextBoxとDropDownListに追加して、div1変更を確認します。次に、divを使用してすべてのコントロールの正しい値を検証し、それに応じてボタンの可視性を設定します。
<script type="text/javascript">
$(document).ready(function () {
$("#div1 input[type='text']").keyup(function () {
checkValues();
});
$("#div1 select").change(function () {
checkValues();
});
checkValues()
});
function checkValues() {
var isValid = true;
$("#div1 input[type='text']").each(function () {
if ($(this).val().length < 2) {
isValid = false;
}
});
$("#div1 select").each(function () {
if ($(this).prop('selectedIndex') === 0) {
isValid = false;
}
});
if (isValid) {
$("#<%=addItem.ClientID%>").removeAttr('disabled');
}
else {
$("#<%=addItem.ClientID%>").attr('disabled', 'disabled');
}
}
</script>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加