CODEWITHSUNDEEP
javascriptasp.netvb.netdotnetnukelightbox2
Jexy
Jexy

Reputation: 1

Linking to javascript & CSS using client resource Management API

I am looking to integrate ”lightbox2” (http://lokeshdhakar.com/projects/ligh...) into a DNN module I am developing, this involves using 4x js and css files in the dnn project which come with Lightbox2.

I have followed the resource client management API guide found here (http://www.dotnetnuke.com/Resources/Wiki/Page/Client-Resource-Management-API.aspx) to try and set this up in my module. Unfortunately when I run the module on my local machine I keep getting an error:

Error: TestModule is currently unavailable. DotNetNuke.Services.Exceptions.ModuleLoadException: The server tag is not well formed. ---> System.Web.HttpParseException: The server tag is not well formed. ---> System.Web.HttpException: The server tag is not well formed. at System.Web.UI.TemplateParser.ProcessError(String message) at System.Web.UI.TemplateParser.ParseStringInternal(String text, Encoding fileEncoding) at System.Web.UI.TemplateParser.ParseString(String text, VirtualPath virtualPath, Encoding fileEncoding) --- End of inner exception stack trace --- at System.Web.UI.TemplateParser.ParseString(String text, VirtualPath virtualPath, Encoding fileEncoding) at System.Web.UI.TemplateParser.ParseFile(String physicalPath, VirtualPath virtualPath) at System.Web.UI.TemplateParser.Parse() at System.Web.Compilation.BaseTemplateBuildProvider.get_CodeCompilerType() at System.Web.Compilation.BuildProvider.GetCompilerTypeFromBuildProvider(BuildProvider buildProvider) at System.Web.Compilation.BuildProvidersCompiler.ProcessBuildProviders() at System.Web.Compilation.BuildProvidersCompiler.PerformBuild() at System.Web.Compilation.BuildManager.CompileWebFile(VirtualPath virtualPath) at System.Web.Compilation.BuildManager.GetVPathBuildResultInternal(VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile, Boolean throwIfNotFound, Boolean ensureIsUpToDate) at System.Web.Compilation.BuildManager.GetVPathBuildResultWithNoAssert(HttpContext context, VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile, Boolean throwIfNotFound, Boolean ensureIsUpToDate) at System.Web.Compilation.BuildManager.GetVPathBuildResult(HttpContext context, VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile, Boolean ensureIsUpToDate) at System.Web.UI.TemplateControl.LoadControl(VirtualPath virtualPath) at DotNetNuke.UI.Modules.WebFormsModuleControlFactory.CreateModuleControl(TemplateControl containerControl, ModuleInfo moduleConfiguration) at DotNetNuke.UI.Modules.ModuleControlFactory.LoadModuleControl(TemplateControl containerControl, ModuleInfo moduleConfiguration) at DotNetNuke.UI.Modules.ModuleHost.LoadModuleControl() --- End of inner exception stack trace ---

I am working in the ascx page (not the code) and my script so far is:

<%@ Register TagPrefix="dnn" Namespace="DotNetNuke.Web.Client.ClientResourceManagement" Assembly="DotNetNuke.Web.Client" %>

<dnn:DnnJsInclude runat="server" FilePath="FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />
<dnn:DnnJsInclude runat="server" FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />
<dnn:DnncssInclude runat="server" FilePath="~/DesktopModules/TestModule/css/lightbox.css" PathNameAlias="SkinPath" />
<dnn:DnncssInclude runat="server" FilePath="~/DesktopModules/TestModule/css/screen.css" PathNameAlias="SkinPath" />

I have had a search around a few forums for an answer but there isnt much help available around this. One similar question is here (How to add a Lightbox to a custom DotNetNuke module) but doesn't go into much detail for a javascript novice such as myself

Would be very grateful if someone could point me in the right direction here

Many Thanks

Upvotes: 0

Views: 1394

Answers (2)

Mark Rabjohn
Mark Rabjohn

Reputation: 1713

I use this stuff in my current project and it works fine. The only thing that I can see that's different between yours and mine is that I don't use the PathNameAlias="SkinPath" attribute.

A good way of cross checking is to open the source code for a page that contains your module, and search for the javascript file or css file by name. If it's there, check that the path is right, if it's not there, then you have a problem.

When I write my own scripts, I generally start with alert('here') just to make sure that they are being included. You could temporarily add that to the start of your lightbox js file.

Mark

Upvotes: 1

Chris Searles
Chris Searles

Reputation: 2412

Your first include line repeats: FilePath="FilePath="~

Delete the second FilePath="

Edits after your comment:

You're loading jQuery twice so I'm assuming one of those is supposed to be loading your lightbox plugin (these are your first two lines once the first one is corrected):

<dnn:DnnJsInclude runat="server" FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />
<dnn:DnnJsInclude runat="server" FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />

Also, I've not tried loading it that way but I have a feeling loading jQuery like this might load it twice (and likely two different versions). Try using:

DotNetNuke.Framework.jQuery.RequestRegistration();

instead.

Upvotes: 1

Related Questions