mvc jquery tab display issue
In my view (that is being uploaded by a dialog) I have several tabs that are being displayed in order for that to happen I need to reference the jquery ui:
<script src="<%= Url.Content("~/Scripts/jquery-ui-1.8.11.js") %>" type="text/javascript"></script>
but due to incorporating this page withing a dialog I need to take this reference to my master page and use that in the contentplaceholders of my view, that is when i have the problem.
this is my code in the view:
<asp:Content ID="Content2" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
jQuery(document).ready(function () {
$("#tabstest").tabs();
});
</script>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
<h2>jQuery Tabs Example</h2>
<div>
<div id="tabstest">
<ul>
<li><a href="#tabs-1">Home</a></li>
<li><a href="#tabs-2">Products</a></li>
<li><a href="#tabs-3">Contact Us</a></li>
</ul>
<div id="tabs-1">
<% Html.RenderPartial("GetHomeTab"); %>
</div>
<div id="tabs-2">
<% Html.RenderPartial("GetProductTab"); %>
</div>
<div id="tabs-3">
<% Html.RenderPartial("GetContactUsTab"); %>
</div>
<开发者_开发技巧/div>
</div>
</asp:Content>
if I remove the jquery UI reference to the master page I recieve this error " Object does not support method 'tabs'", but if I add the same reference to my view the tabs come up.
I will appreciate if anyone knows the reason of this issue
If you move the <script src="...">
to your master page there shouldn't be any problem (I always do this). Check that you're putting it in the correct master page.
A way to test is would be the following:
- Run the page on your browser (there's a js error as you say)
- View its source code
- Look for the
<script src="..."
tag (the jquery ui inclusion).
I'm almost sure you don't have it.
Hope this helps. Cheers
PS: Don't forget to include jquery.js, then jquery.ui, and then your scripts (to ensure you don't have a dependency problem)
精彩评论