更新面板不能异步工作

时间:2016-10-07 17:19:59

标签: javascript c# asp.net ajax

我有一个母版页面,我在下面放置了一个脚本管理器:

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

在内容页面中,我有一个包含Datalist和Button的更新面板,如下所示:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DataList ID="DataList1" runat="server" onitemdatabound="DataList1_ItemDataBound" RepeatLayout="Flow">
<ItemTemplate>
 <div class="post-heading">
  <div class="pull-left image">
    <img src="http://bootdey.com/img/Content/user_1.jpg" class="img-circle avatar" alt="user profile image">
  </div>
 <div class="pull-left meta">
  <div class="title h5">
   <a href="#"><b>Ryan Haywood</b></a>
    made a post.
  </div>
  <h6 class="text-muted time">1 minute ago</h6>
 </div>
</div> 
<div class="post-description"> 
 <asp:Image ID="Image2" class="img img-responsive" ImageUrl='<%#Eval ("pimg") %>' runat="server" />
 <p><asp:Label ID="postlabel" class="postlabel" runat="server" Text='<%#Eval ("ptext") %>'></asp:Label></p>
 <div class="stats">
  <a href="#" class="btn btn-default stat-item">
   <i class="fa fa-thumbs-up icon"></i>2
  </a>
  <a href="#" class="btn btn-default stat-item">
   <i class="fa fa-share icon"></i>12
  </a>
 </div>
</div>
<div class="post-footer">
 <div class="input-group"> 
  <input class="form-control" placeholder="Add a comment" type="text">
   <span class="input-group-addon">
    <a href="#"><i class="fa fa-edit"></i></a>  
   </span>
 </div>
</div>
</ItemTemplate>
</asp:DataList>
<asp:Button ID="Button2" class="btn-block btn-primary" runat="server" Text="Load More" onclick="Button2_Click" ClientIDMode="Static" />
</ContentTemplate>
<Triggers>
 <asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

问题在于,当我点击此“加载更多”按钮时,数据可以正常获取,但会发生整页回发而不是部分回发。 为什么以及如何解决它?

1 个答案:

答案 0 :(得分:1)

您的问题始终是开箱即用的。我的意思是,我总是会看到一些难以纠正的独特问题。为什么会这样??? :P 再见,你的代码看起来绝对没问题。几天前我遇到了类似的问题,并且发现对于一些额外的设计,我指的是一个在线Javascript库。一旦我删除链接,事情就开始起作用了。 我真的需要这些资源,并尝试用css链接替换它,它工作正常。 试一试,可能是你在运行同样的问题。