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

时间:2016-01-05 06:21:25

标签: c# asp.net telerik updatepanel

我有一个注册表单,其中包含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>

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

3 个答案:

答案 0 :(得分:3)

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

  

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

在这种情况下,我们将检查是否由于ddlCountry而启动了异步回发,如果是,则我们取消ajax回发,因此不会回发。

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

取消组合框的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>

以下只是建议而不是解决您特定问题的一部分:另外,我建议远离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>

答案 1 :(得分:3)

老实说,我发现的UpdatePanel比它的价值更麻烦。

  

UpdatePanel控件是Ajax功能的核心部分   ASP.NET。它们与ScriptManager控件一起使用以启用   部分页面渲染。部分页面渲染减少了对   同步回发和完整页面更新时只有部分   页面必须更新。部分页面呈现改善了用户   经验,因为它减少了在a。期间发生的屏幕闪烁   整页回发并改善网页交互性。

我经常发现控件实现会导致更多问题,然后才值得。所以我经常实现自己的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上正确保存数据。

答案 2 :(得分: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>