Using Jquery in master layout page

This forum is only for questions or discussions about working with the mojoPortal source code in Visual Studio, obtaining the source code from the repository, developing custom features, etc. If your question is not along these lines this is not the right forum. Please try to post your question in the appropriate forum.

Please do not post questions about design, CSS, or skinning here. Use the Help With Skins Forum for those questions.

This forum is for discussing mojoPortal development

This forum is only for questions or discussions about working with the mojoPortal source code in Visual Studio, obtaining the source code from the repository, developing custom features, etc. If your question is not along these lines this is not the right forum. Please try to post your question in the appropriate forum.

You can monitor commits to the repository from this page. We also recommend developers to subscribe to email notifications in the developer forum as occasionally important things are announced.

Before posting questions here you might want to review the developer documentation.

Do not post questions about design, CSS, or skinning here. Use the Help With Skins Forum for those questions.
This thread is closed to new posts. You must sign in to post in the forums.
11/23/2009 12:09:29 PM
Gravatar
Total Posts 30

Using Jquery in master layout page

Hi Joe,

 When using jquery such as 

<script>

$(document).ready(function() {

$("#rotator > ul").tabs({ fx: { opacity: "toggle"} }).tabs("rotate", 4000, true);

});

</script>

I put the above script on my new skin's layout master (/data/1/skins/layout.master) then it gives me "object to reference" error. Not quite sure if this is the right location when adding a jquery statement.

I also included the actual .js file on the layout.master page like this : <script src="js/jquery-ui-personalized-1.5.3.packed.js" type="text/javascript"></script>

Thank you for all your help

 

 

11/23/2009 3:29:08 PM
Gravatar
Total Posts 190

Re: Using Jquery in master layout page

The jquery script files aren't loaded in the <head> section. They show up just a bit after the opening of the body tag.  So this jquery reference: $(document) probably isn't being recognized up in the <head> as it's being referenced before the jquery files load.

11/24/2009 9:14:32 AM
Gravatar
Total Posts 18439

Re: Using Jquery in master layout page

Hi,

Both the complete versions of jQuery and jQueryUI are loaded by default in mojoPortal from the google ajax CDN so you don't need to to include the jquery files yourself except for additional plugins. If you want to host the jquery files locally instead of loading from the CDN see http://www.mojoportal.com/intranets-and-private-networks.aspx

Now as I understand it you have to use a parent div to apply jQuery tabs, you can't apply it directly on a ul like you have: 

$("#rotator > ul").tabs

The needed markup for jquery tabs is like this:

<div id="mytabs">

<ul>

<li><a href="#tab1">Features</a></li>

<li><a href="#tab2">Screen Shots</a></li>

<li><a href="#tab3">System Requirements</a></li>

</ul>

<div id="tab1">

<p>Feature description here.</p>

</div>

<div id="tab2">

<p>Screen shots here</p>

</div>

<div id="tab3">

<p>System requirements and other such things.</p>

</div>

</div>

and you would initiate the tabs with $("#mytabsl").tabs(...)

also I think you have incorrect syntax, this does not look correct to me where you call a tabs method on another tabs method and I don't see anything about "rotate" in the documentation:

.tabs({ fx: { opacity: "toggle"} }).tabs("rotate", 4000, true);

I would put your script at the bottom of the layout.master before the closing form tag.

Note also that we have built in support for jQeury tabs.

Hope it helps,

Joe

11/24/2009 10:48:40 AM
Gravatar
Total Posts 30

Re: Using Jquery in master layout page

Hi Joe,

  Tried all your suggestions and worked like a charm! thanks to all those who responded too. greatly appreciated.

-gil

 

 

 

 

You must sign in to post in the forums. This thread is closed to new posts.