2012-07-21 550 views
0

我有一個tabcontainer與三個面板,裏面,我有gridview。當我用戶點擊選項卡時,gridview被加載。我想直到gridview正在加載,應該顯示一個img gif,並且在網格完全加載後應該隱藏。 對於我寫的代碼爲:如何在加載標籤內容時顯示加載圖像?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="example.aspx.cs" 
    Inherits="example" %> 

<%@ Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" 
    Namespace="System.Web.UI" TagPrefix="asp" %> 
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 

    <script type="text/javascript"> 

     $(function() { 



     $("#mytab").mytab({ 
       ajaxOptions: { 
        type: 'POST', 
        data: postData, 
        beforeSend: function() { 
         $('#loader').show(); 
        }, 
        complete: function() { 
         $("#loader").hide(); 
        } 
       } 
      }); 
     }); 

</script> 


</head> 
<body> 
    <form id="form2" runat="server"> 
    <iframe id="iFrame2" runat="server" height="2px" width="2px"></iframe> 
     <asp:UpdatePanel ID="UpdatePanel2" runat="server"> 
    <ContentTemplate> 
    <div> 
     <asp:ScriptManager ID="ScriptManager2" runat="server" EnablePartialRendering="true"> 
     </asp:ScriptManager> 


    </div> 
    <asp:Panel ID="loader" runat="server" Wrap="true" CssClass="body" > 
        <table cellpadding="5" cellspacing="5" style="width:322px; height:245px; border:1"> 
         <tr> 
          <td style="width:322px; height:245px; border:1"> 
           <asp:Image ID="Image1" Width="322px" Height="245px" BorderWidth="0" runat="server" ImageUrl="Images/loading.gif" /> 
          </td> 
         </tr> 
        </table> 
       </asp:Panel> 

     <cc1:TabContainer ID="mytab" runat="server" Width="100%" 
           Visible="true" AutoPostBack="true" > 
           <cc1:TabPanel runat="server" HeaderText="application" ID="TabPanel1" 
            > 
            <ContentTemplate> 
            <asp:Panel ID="Panel1" runat="server"> 
             <table class="outline-tabs"> 
              <tr class="pagination-row"> 

              </tr> 
              <tr> 
               <td> 
                <asp:UpdatePanel ID="UpdatePanel3" runat="server"> 
                 <ContentTemplate> 
                  <asp:GridView ID="GridView1" runat="server" CssClass="tblGrid" AllowSorting="True"> 

                </asp:GridView> 
                 </ContentTemplate> 
                </asp:UpdatePanel> 
               </td> 
              </tr> 

             </table> 
            </asp:Panel> 

            </ContentTemplate> 
           </cc1:TabPanel> 



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

但是當我運行的應用程序,我得到一個錯誤是:

Microsoft JScript runtime error: Object expected

什麼是錯的,上面的代碼,任何文件丟失,因爲我使用jQuery。

+0

jquery在哪裏?未實現?嘗試兩個更多的方法:成功:function(){console.log('data received')}和error:function(err){console.log('Error:'+ err)} – liquid 2012-07-21 17:51:52

+0

like this success:function(){ console.log('data received')} error:function(err){console.log('Error:'+ err)}是否在我的代碼中缺少任何東西,如你所說的jQuery?沒有實現?成功和錯誤功能會做什麼? – 2012-07-21 18:12:25

+0

看來,這是你的主模板,我沒有看到

0

啊,我明白了。示例代碼使用tabs而不是mytab。這意味着示例代碼使用jquery-ui(您在此處找到:http://jqueryui.com/)。

對於標籤您在這裏找到文檔(http://jqueryui.com/demos/tabs/點擊鏈接「查看源代碼」)。

所以看看你的編譯的源代碼與螢火蟲或webinspector和尋找jQuery的,jQuery的UI和所有的源文件,如圖像和CSS的jquery-UI。 如果未實現 - >獲取源代碼。

之後,你應該可以運行你的代碼。

如需更多幫助,請發佈您的編譯(!)源代碼。

相關問題