在更新面板中放置多个控件的正确方法是什么?

I have one registration form which contains 3 to 4 dropdown controls and 2 datepickers and now when dropdown controls value are selected(selectedindex change are fired) then i dont want my page to postback.

我有一个注册表单，它包含3到4个下拉控件和2个datepickers，现在当下拉控件值被选择时(selectedindex更改被触发)，那么我不想让我的页面回发。

I have use update panel to stop this behaviour of post like below:

我已使用更新面板来阻止以下这类帖子的行为:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>

      <%--Update Panel for date picker%>
      <asp:UpdatePanel ID="UpdatePanelDatepicker" runat="server">
                    <ContentTemplate>
                      <telerik:RadDatePicker ID="rdpDate1" runat="server">
                      </telerik:RadDatePicker>
                    </ContentTemplate>
      </asp:UpdatePanel>

       <%--Update Panel for Dropdown--%>
       <asp:UpdatePanel ID="updatepaneldata" runat="server"> 
                      <ContentTemplate>
                     <telerik:RadComboBox ID="ddlCountry" runat="server">
                      </telerik:RadComboBox>
                    </ContentTemplate>
      </asp:UpdatePanel>


  </ContentTemplate>
    </asp:UpdatePanel>

So i just wanted to ask that is this correct way to put multiple controls under update panels??

所以我想问的是，在更新面板中放置多个控件的正确方法是什么?

3 个解决方案

#1

Subscribe to ajax event of initializeRequest on client-side. In this event we can cancel an ajax postback if we need to.

在客户端订阅initializeRequest的ajax事件。在这种情况下，如果需要，我们可以取消ajax回发。

The initializeRequest method is raised before processing of the asynchronous request starts. You can use this event to cancel a postback.

在开始处理异步请求之前，将提出initializeRequest方法。您可以使用此事件取消回发。

In this event, we will check if an async postback is being initiated due to ddlCountry, and if yes then we cancel the ajax post back so no post back occurs.

在这个事件中，我们将检查异步回发是否由于ddlCountry而被发起，如果是，那么我们将取消ajax回发，因此不会发生回发。

To solve your problem just do the following : Add following JavaScript to your aspx page. In code below, the pageLoad method is automatically called by ASP.Net Framework on client-side when browser loads the page and after all scripts have been loaded as well as all client-side objects created.

要解决您的问题，只需执行以下操作:将以下JavaScript添加到您的aspx页面。在下面的代码中，pageLoad方法被ASP自动调用。当浏览器加载页面和所有脚本以及所有创建的客户端对象之后，客户端上的Net框架。

JavaScript to cancel combobox post back

JavaScript取消combobox帖子

<script type="text/javascript">
function pageLoad()
{
     Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(CancelComboBoxPostback);
}

function CancelComboBoxPostback(sender, args)
{
  var prm = Sys.WebForms.PageRequestManager.getInstance();
  if (prm.get_isInAsyncPostBack() & args.get_postBackElement().id == 'ddlCountry') {
         args.set_cancel(true);
    }
 }
</script>

The following is only a recommendation and not a part of the solution to your specific problem: Also, I would recommend to stay away from nested update panels as this can cause unexpected results if developer is not aware of how nested update panels work. In your situation, a single update panel should suffice as in markup below instead of nested update panels that you have used in your original markup.

以下只是一个建议，并不是解决您特定问题的解决方案的一部分:此外，我建议不要使用嵌套更新面板，因为如果开发人员不知道嵌套更新面板的工作方式，这可能导致意外的结果。在您的情况下，一个更新面板应该足够如下面的标记所示，而不是您在原始标记中使用的嵌套更新面板。

Markup without nested update panels

没有嵌套更新面板的标记

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
              <telerik:RadDatePicker ID="rdpDate1" runat="server">
              </telerik:RadDatePicker>

              <telerik:RadComboBox ID="ddlCountry" runat="server">
              </telerik:RadComboBox>
    </ContentTemplate>
</asp:UpdatePanel>

#2

Honestly, the UpdatePanel I find is more trouble than it is worth.

老实说，我发现的UpdatePanel比它的价值还要麻烦。

UpdatePanel controls are a central part of Ajax functionality in ASP.NET. They are used with the ScriptManager control to enable partial-page rendering. Partial-page rendering reduces the need for synchronous postbacks and complete page updates when only part of the page has to be updated. Partial-page rendering improves the user experience because it reduces the screen flicker that occurs during a full-page postback and improves Web page interactivity.

UpdatePanel控件是ASP.NET Ajax功能的核心部分。它们与ScriptManager控件一起使用，以启用部分页面呈现。部分页面呈现减少了对同步回发的需求，并且在页面只有一部分需要更新时，可以完成页面更新。部分页面呈现改进了用户体验，因为它减少了整个页面回发过程中出现的屏幕闪烁，提高了Web页面的交互性。

I often find the controls implementation causes more problems then it is worth. So I often implement my own Ajax services, to handle such logic. You can do this the old school way, quite easy.

我经常发现控件的实现会导致更多的问题，所以它是值得的。因此，我经常实现我自己的Ajax服务，来处理这种逻辑。你可以用老式的方式来做，很简单。

// Create .aspx page, to be our service. 
public class ControlUpdateService
{
     protected void Page_Load(object sender, EventArgs e)
     {
          // Use an approach to determine which control type, and model to build.         
          // You would build your object, then use Newtonsoft.Json, to serialize, then
          // return the object, via Response.End(object). 
     }
}

Then your page would Ajax the data, hit the service, then build your control via the .success in the Ajax call. If you do this approach, you commit to saving your data via Ajax as well. Keep that in mind. As I was answering this question, I can't help but feel your problem actually stems from the control doing an AutoPostback. Which you can actually disable.

然后，您的页面将Ajax数据，点击服务，然后在Ajax调用中通过.success构建您的控件。如果您采用这种方法，您还将承诺通过Ajax保存数据。记住这一点。当我回答这个问题的时候，我不禁感到你的问题其实是由自动回复控制引起的。你可以禁用它。

AutoPostBack = "false";

Telerik may be different, but the documentation should clearly indicate how to disable this feature. Which would eleminate your need for an UpdatePanel all together. Allowing you to save your data, on PostBack correctly.

Telerik可能不同，但是文档应该清楚地指出如何禁用该特性。这将使您需要一个UpdatePanel。允许您保存您的数据，在回发正确。

#3

Use telerik Ajaxloadingpanel except UpdatePanel this is good for your code try this Example

使用telerik Ajaxloadingpanel，除了UpdatePanel，这对您的代码尝试这个示例非常好。

    <telerik:RadAjaxLoadingPanel ID="rlp" runat="server" Skin="Metro">
</telerik:RadAjaxLoadingPanel>

    <telerik:RadAjaxPanel runat="server" LoadingPanelID="rlp" skin="Metro">
        <telerik:RadDatePicker ID="rdpDate1" runat="server">
          </telerik:RadDatePicker>

          <telerik:RadComboBox ID="ddlCountry" runat="server">
          </telerik:RadComboBox>
</telerik:RadAjaxPanel>

#1