JQuery Tabs Ajax not working on IE7 when loading same page with different parameters

JQuery Tabs Ajax not working on IE7 when loading same page with different parameters

Hi,

I am trying to implement jquery ui tabs in ajax mode as shown in http://jqueryui.com/demos/tabs/#ajax. Only difference is , all my tabs urls load the same page with different parameters. This works perfectly fine on Firefox but it is not working on IE7. Please see the output on firefox and IE7 in the attached screen shots . Can somebody help fix this issue? Thanks in advance.

Here is my code.

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head runat="server">
  3.     <title></title>
  4.      <link href="../Styles/JqueryUI/redmond/jquery-ui-1.8.10.custom.css" type="text/css" rel="stylesheet" />
  5.     <script src="../Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
  6.     <script src="../Scripts/jquery-ui-1.8.10.custom.min.js" type="text/javascript"></script>
  7.    
  8.     <script type="text/javascript">
  9.         $(function () {
  10.             $("#tabs").tabs({
  11.                 cache: false,
  12.                 ajaxOptions: {
  13.                     cache: false,
  14.                     error: function (xhr, status, index, anchor) {
  15.                         $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. ");
  16.                     }
  17.                 }
  18.             });
  19.         });
  20.     </script>
  21.    
  22. </head>
  23. <body>
  24.     <form id="form1" runat="server">
  25.      
  26.        <asp:Panel ID="pnlMain" runat="server" >
  27.            <div id="tabs">
  28.                 <ul>
  29.                     <li><a href="#tabs-1">Preloaded</a></li>
  30.                     <li><a href="tabs.aspx?id=1" >Panel 1</a></li>
  31.                     <li><a href="tabs.aspx?id=2" >Panel 2</a></li>
  32.                 </ul>
  33.                 <div id="tabs-1">
  34.                     <p>Testing JQuery AJAX Tabs.</p>
  35.                 </div>
  36.                
  37.           </div>
  38.     </asp:Panel>
  39.     <asp:Panel ID="pnlTest1" runat="server" Visible="false">
  40.         <p>Hi this is Test 1.</p>
  41.     </asp:Panel>
  42.      <asp:Panel ID="pnlTest2" runat="server" Visible="false">
  43.         <p>Hi this is Test 2.</p>
  44.     </asp:Panel>
  45.     </form>
  46. </body>
  47. </html>
  1.  protected void Page_Load(object sender, EventArgs e)
  2.     {
  3.         string id = "";
  4.         if (Request.QueryString["id"] != null)
  5.         {
  6.             id = Request.QueryString["id"];
  7.         }
  8.         switch (id)
  9.         {
  10.             case "1": pnlMain.Visible = false; pnlTest1.Visible = true; break;
  11.             case "2": pnlMain.Visible = false; pnlTest2.Visible = true; break;
  12.         }
  13.     }