Question

我正在使用通过使用jquery ajax加载的asp.net页面。在这个页面中，我使用Gridview显示值列表，如下所示

<asp:GridView ID="GVPrograms" runat="server" AutoGenerateColumns="false" 
        onrowcommand="GVPrograms_RowCommand" AllowPaging="true" BackColor="#f5f5f5"  BorderColor="#ffffff"
         PageSize="2" OnPageIndexChanging="GVPrograms_PageEventHandler" GridLines="None">
        <Columns>             

            <asp:TemplateField HeaderText="Video">
                    <ItemTemplate>                    

                     <div style="float: left; width: 120px" class="play-video"> 
                         <a href="Program.aspx?id=<%#Eval("ID") %>" id='<%#Eval("ID") %>'>                          
                         <img src='<%# GetUrl(Eval("ID")) %>' width='100' height='100' style="" alt="play" />

                         </a>

                       </div>
 </asp:TemplateField> 
 </Columns>

        </asp:GridView>

我已经在PageEventHandler方法中处理了分页，并且工作正常。但无论何时首次加载页面，当我单击gridview中的任何链接时，都会使用以下脚本加载Program.aspx页面

$(".play-video a").click(function () {
              $("#content-placeholder").load(this.href);                
              //alert(this.id);
              return false;
          });

现在，问题是每当我点击下一页（比如第2页）并点击任何链接时，Program.aspx就会显示在新窗口中。那么，如何通过使用上面的jquery脚本使其仍然在同一页面中加载？

我一直在搜索是否有任何解决方法，但找不到任何解决方法。感谢您的帮助。

Answer 1

当您使用UpdatePanel时，您需要在每次更新时重新初始化与此UpdatePanel内容一起使用的javascript，这是因为您更改了Dom结构并且之前的javascript无效更多。

为此，您可以使用UpdatePanel提供的功能，代码如下：

<script type="text/javascript"> 
    // this is your function that we must call on page load 
    //  and after updatepanel updates.
    function InitMyLink()
    {
      $(".play-video a").click(function () {
        $("#content-placeholder").load(this.href);                
        return false;
      });
    }

    // now I capture the two functions that called when UpdatePanel is updated
    var prm = Sys.WebForms.PageRequestManager.getInstance();    
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);

    function InitializeRequest(sender, args) {      
    }

    // this is called after update panel completes the update
    function EndRequest(sender, args) {
        InitMyLink();
    }

    // this is called on first page load
    $(document).ready(function() {
      InitMyLink();
    });
</script>

GridView Paging在ASP.NET中不能使用jQuery

1 个答案: