使用 AJAX 3.5 从另一个 DropDownList 填充 DropDownList
我正在使用 asp.net 3.5 和 ajax 工具包。
问题：我有一个自定义控件，更新面板中有两个下拉列表。第一个 DDL 具有属性 AutoPostBack="true"，选择后会填充第二个 DDL。问题是在初始页面加载后第一次选择 DDL，整个页面都会重新加载。第二次选择第一个 DDL 中的项目时，一切都会按预期进行。
我尝试在 UpdatePanel 中添加触发器，但这不会改变结果。
任何帮助表示赞赏。
.ascx:
<asp:UpdatePanel ID="popDates" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<p>
<asp:DropDownList ID="ddlDivision" runat="server" AutoPostBack="true" style="width:300px"></asp:DropDownList>
<asp:RequiredFieldValidator ID="requiredDivision" runat="server"
ControlToValidate="ddlDivision" ErrorMessage="* Please specify a value"
ValidationGroup="valGroupGetDates"
InitialValue="Select..." SetFocusOnError="True" CssClass="formValidation">
</asp:RequiredFieldValidator>
</p>
<p>
<asp:DropDownList ID="ddlKMA" runat="server" Enabled="False" AutoPostBack="true" style="width:300px"></asp:DropDownList>
<asp:RequiredFieldValidator ID="requiredKMA" runat="server"
ControlToValidate="ddlKMA" ErrorMessage="* Please specify a value"
ValidationGroup="valGroupGetDates"
InitialValue="Select..." SetFocusOnError="True" CssClass="formValidation">
</asp:RequiredFieldValidator>
</p>
</ContentTemplate>
</asp:UpdatePanel>
ascx.cs:
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsAsync || Page.IsPostBack)
{
String target = Page.Request.Params.Get("__EVENTTARGET");
//Division Session
Session["divisionDropDown"] = ddlDivision.SelectedItem.Value;
populateDivisionDDL();
ddlDivision.SelectedValue = Session["divisionDropDown"].ToString();
if (target != "" && target != null)
{
if (target.Contains("ddlDivision"))
{
populateKMA(ddlDivision.SelectedValue);
}
}
}
if (!Page.IsPostBack)
{
populateDivisionDDL();
ddlKMA.Items.Clear();
ddlKMA.Items.Add(default_item());
}
}
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
}
aspx:
<body>
<form id="ViewSPANodeDatesForm" runat="server">
<div>
<asp:ScriptManager ID="ScriptManagerDates" runat="server"></asp:ScriptManager>
<viewControl:SPANodeDates ID="SPANodeDates1" runat="server"></viewControl:SPANodeDates>
</div>
</form>
</body>
注意：在添加ajax控件之前，一切都按预期工作。
谢谢！
I am using asp.net 3.5 with the ajax toolkit.
The problem: I have a custom control with two drop down lists in an update panel. The first DDL has the property AutoPostBack="true" and upon selection the second DDL is populated. The issue is the first time after initial page load the DDL is selected, the entire page reloads. The second time an item in the first DDL is selected, everything works as expected.
I have tried adding Triggers in the UpdatePanel, but that does not change the outcome.
Any help is appreciated.
.ascx:
<asp:UpdatePanel ID="popDates" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<p>
<asp:DropDownList ID="ddlDivision" runat="server" AutoPostBack="true" style="width:300px"></asp:DropDownList>
<asp:RequiredFieldValidator ID="requiredDivision" runat="server"
ControlToValidate="ddlDivision" ErrorMessage="* Please specify a value"
ValidationGroup="valGroupGetDates"
InitialValue="Select..." SetFocusOnError="True" CssClass="formValidation">
</asp:RequiredFieldValidator>
</p>
<p>
<asp:DropDownList ID="ddlKMA" runat="server" Enabled="False" AutoPostBack="true" style="width:300px"></asp:DropDownList>
<asp:RequiredFieldValidator ID="requiredKMA" runat="server"
ControlToValidate="ddlKMA" ErrorMessage="* Please specify a value"
ValidationGroup="valGroupGetDates"
InitialValue="Select..." SetFocusOnError="True" CssClass="formValidation">
</asp:RequiredFieldValidator>
</p>
</ContentTemplate>
</asp:UpdatePanel>
ascx.cs:
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsAsync || Page.IsPostBack)
{
String target = Page.Request.Params.Get("__EVENTTARGET");
//Division Session
Session["divisionDropDown"] = ddlDivision.SelectedItem.Value;
populateDivisionDDL();
ddlDivision.SelectedValue = Session["divisionDropDown"].ToString();
if (target != "" && target != null)
{
if (target.Contains("ddlDivision"))
{
populateKMA(ddlDivision.SelectedValue);
}
}
}
if (!Page.IsPostBack)
{
populateDivisionDDL();
ddlKMA.Items.Clear();
ddlKMA.Items.Add(default_item());
}
}
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
}
aspx:
<body>
<form id="ViewSPANodeDatesForm" runat="server">
<div>
<asp:ScriptManager ID="ScriptManagerDates" runat="server"></asp:ScriptManager>
<viewControl:SPANodeDates ID="SPANodeDates1" runat="server"></viewControl:SPANodeDates>
</div>
</form>
</body>
Note: Before adding the ajax controls, everything worked as expected.
Thanks!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
这里有三个使用控制器和 Web 服务的级联下拉列表的示例。
http://stephenwalther.com/blog/archive/2008/09/07/asp-net-mvc-tip-41-creating-cascading-dropdown-lists-with-ajax.aspx
我可以粘贴整个信息，但我相信链接会更好。甚至史蒂芬也提供了它的代码示例。
brgds。
here you have three examples of cascading dropdownlist using controller and webservice.
http://stephenwalther.com/blog/archive/2008/09/07/asp-net-mvc-tip-41-creating-cascading-dropdown-lists-with-ajax.aspx
I can paste the whole info but I believe the link will be better. even stephen offer code example of it.
brgds.
回应 Andee 的评论：
更新面板不是 AJAX 是什么意思？首先让我们讨论一下普通网页中会发生什么。没有 AJAX，没有更新面板。
该页面是从服务器拉取的，以及任何外部 javascript、外部 css、图像等。每一个都是一个 HTTP 请求。因此，当您完成时，您可能有 5、10、20+ 个 http 请求。目标是尽可能少，因为一次只能有两个请求（有很多方法可以解决这个问题）。
问题是如果我们要改变页面上的少量数据需要我们从服务器获取怎么办？回发页面并获取所有相同的未更改数据并处理所有 http 请求可能会很疯狂。这就是 AJAX 的美妙之处，我们可以使用 javascript 与服务器对话并让它返回给我们一些数据。它只会使用一个 http 请求，并且我们只取回数据。换句话说，它的速度要快得多，因为它只有一个 http 请求，而且文件大小很小。此外，没有页面闪烁，因为我们没有向服务器请求新页面。
另一方面，更新面板给您 AJAX 的印象（没有页面闪烁），但它仍然会进行回发，并且您会招致所有不需要的 HTTP 请求。这意味着虽然您没有出现页面闪烁，但您仍然会遇到界面延迟，因为获取数据需要比真正的 AJAX 调用更长的时间。
In response to Andee's comment:
What do you mean the update panel isn't AJAX?First let's talk about what happens in a normal web page. No AJAX, no update panels.
The page is pulled from the server, and any external javascript, external css, images etc. Each one is an HTTP request. So you might have 5,10,20+ http requests by the time you're done. The goal is to have as few as possible, as you can only have two requests at one time (there are ways around this).
The problem is what if we want to change a small amount of data on the page that requires us to get it from the server? It might be crazy to postback the page and get all of the same unchanged data back, and deal with all of the http requests. This is the beauty of AJAX, we can use javascript to talk to the server and have it return to us some data. It would only use one http request and we only get back the data. In other words it's much faster because it's only one http request and it's a small file size. Additionally there is no page flicker because we haven't requested a new page from the server.
The update panel on the other hand gives you the impression of AJAX (no page flicker) but it still does a post back and you incur all of the unneeded HTTP requests. Which means that while you don't get a page flicker, you still get interface lag because it takes longer to get the data then a true AJAX call.
我感谢每个人的回应，并且我确信您的解决方案更加优雅、更快并且实际上是正确的（仍在通过您的链接@sebastian_h 进行工作）。与此同时，将
AutoPostBack="true"保留在第一个 DDL 中并添加到 updatePanel 开始工作。我上次尝试添加目标时一定更改了其他一些设置。
再次感谢！
I appreciate everyone's responses and I'm sure your solutions are much more elegant, faster, and actually correct (still in the process of working through your link @sebastian_h). In the meantime, keeping
AutoPostBack="true"in the first DDL and addingto the updatePanel started working. I must have changed some other setting in my last attempt at adding the target.
Thanks again!