当autopostback必须设置为true(包括代码';s)时,不回发的Dropdownlist

本文关键字:Dropdownlist 设置 autopostback true 代码 包括 | 更新日期: 2023-09-27 18:29:08

我创建了一个下拉列表和相应的日历扩展程序w。下拉列表的每个值都应根据选择对样式可见性产生不同的影响。与现在一样,该功能正常工作;但是,每次我尝试选择不同的列表项时,它都会刷新整个页面,我不想将AutoPostBack设置为"false"。请告诉我解决这个问题的最佳方法是什么。

asp.ascx

           <asp:DropDownList ID="dropdownlist" runat="server"  OnSelectedIndexChanged="dropdownlist_SelectedIndexChanged" AutoPostBack="True" >
                        <asp:ListItem Value="1">a</asp:ListItem>
                        <asp:ListItem Value="2">b</asp:ListItem>
                        <asp:ListItem Value="3">c</asp:ListItem>
                        <asp:ListItem Value="4">d</asp:ListItem>
                        <asp:ListItem Value="5">e</asp:ListItem>
                        <asp:ListItem Value="6">f</asp:ListItem>
                        <asp:ListItem Value="7">g</asp:ListItem>
                    </asp:DropDownList> <asp:Panel runat="server" ID="StartDate" >
                    <asp:Label ID="lblStartDate"  runat="server" Text="Start Date:"></asp:Label>
                    <asp:TextBox ID="txtStartDate" runat="server"></asp:TextBox>
                    <asp:CompareValidator ID="CompareValidatorStartDate" runat="server" ErrorMessage="Please enter a validate date" ControlToValidate="txtStartDate" Type="Date" Operator="DataTypeCheck" Display="Static" Font-Italic="False" SetFocusOnError="True"></asp:CompareValidator>
            </asp:Panel>
            <cc1:CalendarExtender ID="CalendarExtenderStartDate" TargetControlID="txtStartDate" runat="server"></cc1:CalendarExtender>
            <asp:Panel runat="server" ID="EndDate" >
                    <asp:Label ID="lblEndDate" runat="server" Text="End Date:"></asp:Label>
                    <asp:TextBox ID="txtEndDate" runat="server"></asp:TextBox>
                    <asp:CompareValidator ID="CompareValidatorEndDate" runat="server" ErrorMessage="Please enter a validate date" ControlToValidate="txtEndDate" Type="Date" Operator="DataTypeCheck" Display="Static" Font-Italic="False" SetFocusOnError="True"></asp:CompareValidator>
            </asp:Panel>
            <cc1:CalendarExtender ID="CalendarExtenderEndDate" TargetControlID="txtEndDate" runat="server"></cc1:CalendarExtender>

背后的代码

if (!IsPostBack)
    {

            SetDateFields();
    }
}

  protected void dropdownlist_SelectedIndexChanged(object sender, EventArgs e)
{
    SetDateFields();
} 
    private void SetDateFields()
{ 
    switch (dropdownlist.SelectedValue)
    {
        case "1":
        case "3":
        case "5":
            EndDate.Visible = false;
            StartDate.Visible = true;
            lblStartDate.Text = "As Of Date:";
            break;
        case "7":
            EndDate.Visible = false;
            StartDate.Visible = false;
            break;
        default:
            EndDate.Visible = true;
            StartDate.Visible = true;
            lblStartDate.Text = "Start Date:";
            lblEndDate.Text = "End Date:";
            break;
    }   
}

当autopostback必须设置为true(包括代码';s)时,不回发的Dropdownlist

或者您可以使用客户端代码来执行此操作,并用<select>替换<asp:DropDownList>。然后,您可以使用jQuery将事件处理程序附加到,并在选择发生更改时触发函数。

简单示例:

在页面后面或部分的javascript代码中:

<script type="text/javascript">
    $(document).ready(function(){
        $("#mySelect").bind("change", function () {
            var val = $(this).val();
            alert("Selection was " + val);
        });
    });
</script>

然后在您希望呈现下拉列表的位置:

<select id="mySelect">
    <option value="1">a</option>
    <option value="2">b</option>
    <option value="3">c</option>
</select>

我坚信不要使用服务器端资源来呈现html,这些html一开始就可以写成客户端代码。<asp:DropDownList>将被渲染为与最初使用<select>几乎相同的html。

该页面上的所有html元素都可以使用html标记而不是转换为html的asp标记来编写。对使用jQuery处理客户端代码的事件进行一些研究。它将改变您对web应用程序编程的看法。

或者您可以使用更新面板(需要Microsoft Ajax控制工具包)。这是微软的文档页面:http://www.asp.net/Ajax/Documentation/Live/overview/UpdatePanelOverview.aspx

您可以使用JQuery来完成此操作。将更改处理程序连接到下拉列表,并让它处理可见性和文本分配。。