Scenario: Loading partial views into jquery tabs(Ajax Mode) using MVC3 &Razor . Works fine in FF but not in IE8 or IE7.
Problem: I can trace the ajax request & responses in firebug fine and see partial views returned from the server (containing JqGrid Html Helper methods).This loads up fine within the tab conatiners in firefox.But in IE nothing happens and i cant see any ajax requests getting fired from changing tabs when i use Fiddler.Ive tried playing around with the ajaxOptions when i initialize jq Tabs to no avail . Ive had this problem on MVC2 and i resorted to laying the tabs contents out statically ,which i dont want this time, as i need lazy loading. Anyhelp would be greatly appreciated as i have exhausted every avenue , thank you. :) Below is a full page source dump from IE8, renedered using the razor view engine.
(Links to all Csss and JS libs)
<script type="text/javascript">
$(document).ready(function () {
$("#tabs").tabs();
});
</script>
</head>
<body>
<h2>Index</h2>
<div id="tabs">
<ul>
<li><a href="/"><span>Home</span></a> </li>
<li><a href="/ServicesMonitored/GetServicesMonitoredTab"><span>Monitored Services</span></a> </li>
<li><a href="/ServicesMonitored/GetServicesFullTab"><span>Full Services</span></a></li>
</ul>
开发者_高级运维 </div>
</body>
</html>
From Controller:
public class ServicesMonitoredController : Controller {
IServicesMonitoredRepository<ServiceHeaderInfo,InfoDataItem> Services;
public ServicesMonitoredController() {
Services = new ServicesMonitoredRepository();
}
public ActionResult GetServicesMonitoredTab()
{
return PartialView("ServicesMonitoredTab");
}
public ActionResult GetServicesFullTab()
{
return PartialView("ServicesFullTab");
}
#region Return Services
[HttpPost]
public JsonResult ReturnServices(string sidx, string sord, int page, int rows)
{ blahblahblah For JqGrid residing in tabs
}
}
Try putting your code inside a ready function. It's likely that the DOM is not fully loaded or ready to be manipulated at the time you are setting up your function to refer to the #tab element.
$().ready(function() {
$(function () {
$("#tabs").tabs();
});
});
精彩评论