How to proper include JS libs (jqueryUI, jquery plugins) into DNN 5 module ?
I include jquery into my module with DotNetNuke.Framework.jQuery.RequestRegistration();
and it works like expected.
Other scripts I include into my DNN portal via Page Settings/Advanced Settings/Page Header Tags. They also get loaded, but they don't work as expected.
In my case I want to have tabs in one of my dnn modules and I'm using jqueryUI to do this. If I test this module outside of DNN it works like it should, but when installed into DNN something goes wrong. I get the tabs created but I can't switch betwen them. Actualy I see all of the content which should 开发者_开发技巧be in separated tabs in the same page.
This is my Js code from module.ascx file.
<script type="text/javascript">
jQuery(document).ready(function ($) {
$("#<%= pnlTabs.ClientID %>").tabs();
});
</script>
how to correct this ? I think that problem is that all this different JS libs get mixed. So what is the correct way to include another JS libs into DNN module.
EDIT: I found the problem. Can you help fix it ?
<li><a href="DesktopModules/OsControl/#dnn_ctr380_osControl_pnlProcesses">Processes</a></li>
<div id="dnn_ctr380_OsControl_pnlProcesses" style="text-align:left;">
Problem is that DNN prepends "DesktopModules/OsControl/" to the link in "li" element. How to prevent this or any other way around this ?
EDIT2:
<asp:BulletedList ID="BulletedList1" runat="server" BulletStyle="NotSet" DisplayMode="HyperLink">
<asp:ListItem Value="#OsControl_pnlProcesses">Processes</asp:ListItem>
<asp:ListItem Value="#OsControl_pnlServices">Services</asp:ListItem>
<asp:ListItem Value="#OsControl_pnlEvents">Events</asp:ListItem>
</asp:BulletedList>
This is how I create links.
I would first suggest to go through this artilce
The way you are adding jQuery and jQuery UI references may cause problems, please make sure jQuery.js is added before jQuery.ui.js.
If you think almost all the page requires jQuery, you can move your jQuery registration code to skin as well.
last thing is to add console logging
to see the log messages in firebug console so that you can quickly track the script reference related problems
Follow the steps below, and you should be fine:
- Login as HOST, go to Host > Portal Settings, expand jQuery Settings node, and check " Use Hosted jQuery version"
- Add all other js references to Default.aspx file
精彩评论