如何正确地将多个控件放在UpdatePanel内？

Question

如何正确地将多个控件放在UpdatePanel内？

14

我有一个包含3到4个下拉控件和2个日期选择器的注册表单，当下拉控件值被选中（选定索引改变时），我不希望我的页面重新加载。

我使用更新面板来阻止这种重新加载行为，如下所示：

<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>

所以我想问的是，将多个控件放在更新面板下面的方式是否正确？

- Learning-Overthinker-Confused

@rdmptn：我有多个下拉控件和日期选择器，其中autopostback属性设置为true，当选择这些下拉框和日期选择器时，我的页面会进行postback。在我的页面中，我为每个下拉框和日期选择器保留了更新面板，因此我希望只有一个更新面板解决方案，可以控制所有选择控件的postback。 - Learning-Overthinker-Confused

2

发布您当前的设置和问题。否则，一切都是猜测，无论是否有赏金。现在我可以说的是尽量避免嵌套更新面板。 - rdmptn

@rdmptn：我在搜索这个更新面板方面已经找了很多，但是我在互联网上或者SO上没有找到任何好的文章或帖子，可以让我从中获得一些东西。但是我在更新面板方面找到了你的一些答案，看起来你对更新面板有很好的理解。 - Learning-Overthinker-Confused

1

当你说“我不想它回传”时，是因为它给你带来了其他问题吗？不要与WebForms对抗-与之合作吧 ;) - Squiggle

如果您不想要一个帖子，为什么将AutoPostBack设置为True？那么服务器端执行的目的是什么？ - Mikhail

显示剩余2条评论

3个回答

3

订阅客户端的ajax事件initializeRequest。在此事件中，如果需要，我们可以取消ajax回发。

在异步请求处理开始之前引发了initializeRequest方法。您可以使用此事件来取消回发。

在此事件中，我们将检查是否由ddlCountry发起异步回发，如果是，则取消ajax回发，以便不会发生回发。

要解决您的问题，请执行以下操作：将下面的JavaScript添加到您的aspx页面中。在下面的代码中，当浏览器加载页面并且所有脚本已加载并且所有客户端对象已创建后，ASP.Net Framework会自动调用pageLoad方法。

取消组合框回发的JavaScript代码如下：

<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>

以下仅为建议，不是解决您特定问题的一部分：此外，我建议避免使用嵌套更新面板，因为如果开发人员不了解嵌套更新面板的工作原理，这可能会导致意外结果。在您的情况下，单个更新面板应该足够，如下所示的标记，而不是您在原始标记中使用的嵌套更新面板。

没有嵌套更新面板的标记

<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>

- Sunil

但是我还有一个国家、州和城市的下拉菜单，其中国家和州的下拉菜单的自动提交属性设置为true。 - Learning-Overthinker-Confused

你的意思是想要停止其他控件的回传，而不仅仅是 ddlCountry 吗？ - Sunil

状态下拉菜单的ID是什么？ - Sunil

ddlCountry、ddlState、ddlCity 和 DdlBranch。这些下拉框控件都设置了autopostback属性=true。是的，我想停止所有控件的post back，但在国家下拉框更改时，我会填充我的州下拉框，在州下拉框中我会填充我的城市下拉框，在分行下拉框选择时，我在服务器端有一些逻辑。 - Learning-Overthinker-Confused

此外，在CancelComboBoxPostback函数中，if条件为false，因此if条件内的代码行不会执行。 - Learning-Overthinker-Confused

显示剩余4条评论

2

使用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>

- Muhammad Asad

1

如果您正在使用Telerik控件，则请使用Telerik Ajax面板，这将在未来对您非常有帮助。如果您想要在更新面板中上传文件，则还需要添加触发器标记以进行更新，并且每次应用程序回传时，您上传的文件都会丢失。如果您正在使用Telerik，请尝试使用所有Telerik控件，这将减少代码的复杂性。 - Muhammad Asad

你能帮我解答这个问题吗：http://stackoverflow.com/questions/35356677/handle-multiple-delete-events-from-grid-with-single-events-handlers-asp-net - Learning-Overthinker-Confused

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Greg · Accepted Answer

老实说，我认为UpdatePanel带来的麻烦大过其价值。

UpdatePanel控件是ASP.NET中Ajax功能的核心部分。它们与ScriptManager控件一起使用，以实现页面局部更新。页面局部更新减少了在需要更新页面的部分时进行同步回发和完整页面更新的需求。页面局部更新提高了用户体验，因为它减少了在进行全页面回发时产生的屏幕闪烁，并提高了Web页面的交互性。

我经常发现这些控件的实现会带来更多问题，所以我常常自己实现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). 
     }
}

那么你的页面将通过Ajax获取数据，调用服务，然后通过Ajax调用中的.success构建控件。如果您采用这种方法，您需要通过Ajax保存您的数据。记住这一点。当我回答这个问题时，我不禁感到你的问题实际上源于控件执行AutoPostback。您可以将其禁用。

AutoPostBack = "false";

Telerik可能与其他工具不同，但文档应该清楚地说明如何禁用该功能，这将完全消除您对UpdatePanel的需求。这样可以允许您在PostBack时正确保存数据。