我有一个带有三个面板的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 :(得分:0)
试试这个而不是你的......
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#mytab").mytab({
ajaxOptions: {
type: 'POST',
data: postData,
beforeSend: function() {
$('#loader').show();
},
success: function(data) {
console.dir(data)
},
error: function(error) {
console.dir('ERROR: ' + error)
}
complete: function() {
$("#loader").hide();
}
}
});
})
</script>
使用console.dir();您在chrome或firebug中跟踪传入的数据对象。即不是一个很好的发展浏览器。
希望这会有所帮助。
答案 1 :(得分:0)
tabs
代替mytab
。这意味着示例代码使用jquery-ui(您可以在此处找到它:http://jqueryui.com/)。
对于标签,您可以在此处找到文档(http://jqueryui.com/demos/tabs/点击链接“查看源”)。
所以用firebug或webinspector查看你的编译源代码,然后查找jquery,jquery-ui以及jquery-ui的所有源文件,如images和css。 如果没有实施 - &gt;得到消息来源。
在此之后,您应该能够运行您的代码。
如需更多帮助,请发布您的已编译(!)源代码。