Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1886
  • Last Modified:

jQuery tabs not working in IE

I have a page using the jQuery UI tabs ajax method. Content form all tabs display perfectly in FF. The tabs display in IE but the content will not load when the tab is clicked.

in the head
<script>
&#9;$(function() {
&#9;&#9;&#9;  
&#9;&#9;$( "#tabs" ).tabs(<%if request("showpaycheck") = 1 then response.Write("{ selected: 1}")%>);
&#9;&#9;&#9;
&#9;});

</script>

The tabs:

<div style="width:inherit" id="tabs">
     <ul>
         <li><a href="grid_general.asp?editid=<%=request("editid")%>"><span>General</span></a></li>
         <li><a href="grid_contact.asp?editid=<%=request("editid")%>"><span>Contact</span></a></li>
         <li><a href="grid_moduleaccess.asp?editid=<%=request("editid")%>"><span>Access</span></a></li>
     </ul>
</div>
0
griffaw
Asked:
griffaw
  • 7
  • 3
2 Solutions
 
griffawAuthor Commented:
0
 
BurniePCommented:
Hi,

I don't know if this is your real tabs or you just copy pasted them for a sample, but you have quote issues :

<div style="width:inherit" id="tabs">
     <ul>
         <li><a href="grid_general.asp?editid=<%=request("editid")%>"><span>General</span></a></li>
         <li><a href="grid_contact.asp?editid=<%=request("editid")%>"><span>Contact</span></a></li>
         <li><a href="grid_moduleaccess.asp?editid=<%=request("editid")%>"><span>Access</span></a></li>
     </ul>
</div>

You are using double quotes inside double quotes.  Should be more like :

<div style="width:inherit" id="tabs">
     <ul>
         <li><a href='grid_general.asp?editid=<%=request("editid")%>'><span>General</span></a></li>
         <li><a href='grid_contact.asp?editid=<%=request("editid")%>'><span>Contact</span></a></li>
         <li><a href='grid_moduleaccess.asp?editid=<%=request("editid")%>'><span>Access</span></a></li>
     </ul>
</div>
0
 
griffawAuthor Commented:
BurnieP:

I tried your edit...same problem. Still no content in tabs.

PS: these are the real tabs.

Thanks
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
BurniePCommented:
Hi,

Just another ckeckup, you have javascript enabled on your IE browser?
0
 
griffawAuthor Commented:
BurnieP:

Yes.

PS: Non-ajax tabs work perfectly in IE. Only the ajax method fails.

0
 
griffawAuthor Commented:
Any thoughts?

Thanks
0
 
Sudaraka WijesingheWeb Application ProgrammerCommented:
Can you show us how the final HTML is rendered (without the server side code)?
0
 
griffawAuthor Commented:
I'm officially embarrased....there was a single orphan </div> tag in the body on the pages being called by the ajax tabs.

i "ass"umed that since FF displayed ok and IE did not that the issue was browser related...never checked the html. Oh well, lesson learned. I'll split the points among everyone that responded.

I curious though, how could FF handle it and IE choked?

0
 
BurniePCommented:
I'm glad you found it.

I'm surprised that FF is more forgiving on small mistakes like that.  I generally assume that IE is normally more forgiving and FF is really by the book of html.
0
 
griffawAuthor Commented:
Score one for Redmond :)
0
 
griffawAuthor Commented:
Interesting that both FF and IE forgave the orphan with html tabs. Only IE failed with the ajax method.
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

  • 7
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now