Ajax UpdateProgress无法正常工作

时间:2013-10-11 11:05:04

标签: javascript asp.net ajax

我在asp点网中使用ajax UpdateProgress栏,点击按钮但是查询执行写入格式但prrgress栏没有运行如何解决这类问题.plz帮我给我任何进度条的解决方案

 <html xmlns="http://www.w3.org/1999/xhtml">
 <head runat="server">
 <title></title>
 <style type="text/css">
    .style1
    {
        width: 100%;
    }
 </style>
 <script language="javascript" type="text/javascript">
    var prm = Sys.WebForms.PageRequestManager.getInstance();

    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);
    var postBackElement;
    function InitializeRequest(sender, args) {

        if (prm.get_isInAsyncPostBack())
            args.set_cancel(true);
        postBackElement = args.get_postBackElement();
        if (postBackElement.id == 'Button1')
            $get('UpdateProgress1').style.display = 'block';
    }



    function EndRequest(sender, args) {
        if (postBackElement.id == 'Button1')
            $get('UpdateProgress1').style.display = 'none';
    }



 </script>
 </head>
 <body>
 <form id="form1" runat="server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">  
   <ContentTemplate>  
  <asp:ToolkitScriptManager ID="ScriptManager1" runat="server">
       </asp:ToolkitScriptManager>

       <table class="style1">
           <tr>
               <td>
                   &nbsp;</td>
               <td>
                   <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
               </td>
               <td>
                   <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
               </td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
           </tr>
           <tr>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
           </tr>
           <tr>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
           </tr>
           <tr>
               <td>
                   </td>
               <td>
                   </td>
               <td>
                   <asp:Button ID="Button1" runat="server" onclick="Button1_Click"Text="Button"/>
               </td>
               <td>
                   </td>
               <td>
                  </td>
               <td>
                       </td>
           </tr>
           <tr>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>

               </td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
               <td>
                   &nbsp;</td>
           </tr>
           <tr>
               <td>
                   &nbsp;</td>
               <td>
               </td>
               <td>
              </td>
               <td>
                 </td>
               <td>
                  </td>
               <td>
                 </td>
           </tr>
       </table>


  <asp:UpdateProgress ID="PageUpdateProgress" runat="server">
                        <ProgressTemplate>
                            <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                                <ProgressTemplate>
                                 <img src="images/ajax-loader.gif" alt="image missing" />
                                </ProgressTemplate>
                            </asp:UpdateProgress>
                        </ProgressTemplate>
                    </asp:UpdateProgress>

  </ContentTemplate>
  </asp:UpdatePanel>
  </form>
  </body>
 </html>

1 个答案:

答案 0 :(得分:0)

我认为你错过了prm.add_beginRequest(onPrmBeginRequest);

请求开始时必须显示进度:

onPrmBeginRequest = function (sender, args) {
    var postBackElement = args.get_postBackElement();
    if (postBackElement.id == 'Button1') {
        $get('UpdateProgress1').style.display = 'block';
    }
}

因此,请将相应的代码块从initializeRequest移至beginRequest

现在您可以隐藏在endrequest

注意

除非指定id,否则clientIDMode可能已被ASP.Net破坏。因此,请确保您使用的是id ctl00_ContentPlaceHolder1_UpdateProgress1。{/ p>