ASP.. NET服务器控件-基于下拉选择显示隐藏文本框

ASP.NET Server Controls - Show Hide Textbox based on Dropdown selection

本文关键字:显示 隐藏 文本 选择 于下拉 NET 服务器控件 ASP      更新时间:2023-09-26

根据用户从下拉菜单中选择的内容显示/隐藏文本框或整个div部分的最佳方法是什么?我不相信这可能与服务器控件,所以我将不得不使用常规的客户端HTML控件,对吗?谢谢你的建议。jQuery是最好的选择吗?是否有一种方法可以默认隐藏Div,然后在用户从下拉菜单中选择选项时显示它?

<div id="divLimitPrice">Limit Price<br />
        <asp:TextBox ID="txtLimitPrice" runat="server" ValidationGroup="ValidationGroupOrder"></asp:TextBox>
        &nbsp;<asp:RequiredFieldValidator ID="rfvLimitPrice" runat="server" ControlToValidate="txtLimitPrice" ErrorMessage="This is a required field."></asp:RequiredFieldValidator>
        </div>
<script type="text/javascript">
    $(function () {
        $('[id*="ddPriceType"]').on('change', function () {
            var val = this.value,
                $divLimitPrice = $('[id*="divLimitPrice"]');
            if (val === 1 || val === 2) {
                // Hide div group
                $divLimitPrice.hide();
            } else {
                // Show div group
                $divLimitPrice.show();
            }
        });
    });
</script>
 Price Type<br />
        <asp:DropDownList ID="ddPriceType" runat="server" ValidationGroup="ValidationGroupOrder">
            <asp:ListItem Value="" Text ="Select a Price Type" />
            <asp:ListItem Value="2" text="Type 2" />
            <asp:ListItem Value="3" text="Type 3" />
            <asp:ListItem Value="4" text="Type 4" />
        </asp:DropDownList>
        &nbsp;<asp:RequiredFieldValidator ID="rfvPriceType" runat="server" ControlToValidate="ddPriceType" ErrorMessage="This is a required field."></asp:RequiredFieldValidator>
        <div id="divLimitPrice">Limit Price<br />
        <asp:TextBox ID="txtLimitPrice" runat="server" ValidationGroup="ValidationGroupOrder"></asp:TextBox>
        &nbsp;<asp:RequiredFieldValidator ID="rfvLimitPrice" runat="server" ControlToValidate="txtLimitPrice" ErrorMessage="This is a required field."></asp:RequiredFieldValidator>
        </div>`

嗯. .我试着调整代码,我错过了一些东西!任何想法吗?感谢您的宝贵时间。

一切皆有可能。你可以做你在问题中所要求的任何事情。也不需要切换到普通的HTML控件。如果你想隐藏一个文本框或div也没关系。我将向您展示一个没有aspx控件的简单示例。按照同样的方法,你会得到你期望的结果。

查看此链接

JSFiddle这里

在div标签中你可以使用任何aspx控件

<div>
<asp:textbox id="TxtSample" runat="server" />
</div>
Or Instead of DIV you can use Panels too
<asp:Panel ID="PnlLogin" runat="server">
 -- --  Your Controls Here
</asp:panel>

您可以使用.jquery

$(function () {
    $('[id*="dropdown"]').on('change', function () {
        var val = this.value,
            $txtbox = $('[id*="txtLimitPrice"]');
        if (val === 1 || val === 2) {
            // Hide text box
            $txtbox.hide();
        } else {
            // Show text box
            $txtbox.show();
        }
    });
});