Log in

View Full Version : AJAX part of Smooth Navigational Menu does not work


MrBiggz
08-07-2012, 11:16 PM
1) Script Title: Smooth Navigational Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.htm (http://www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.htm)

3) Describe problem: ajax option of this script is not working.

I have double checked that all of the file exist. The default examples worked with this setup and I also had the menu that was being trying working. I went to move this to an ajax setup per the instruction and nothing.

If somebody could show me the error of my ways I'd greatly appreciate it!

Thanks much!

This is the main document:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Conforming XHTML 1.0 Transitional Template</title>

<link rel="stylesheet" type="text/css" href="css/ddsmoothmenu.css" />
<link rel="stylesheet" type="text/css" href="css/ddsmoothmenu-v.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="javascript/ddsmoothmenu.js">

/***********************************************
* Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

<script type="text/javascript">
ddsmoothmenu.init({
mainmenuid: "smoothmenu-ajax", //menu DIV id
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu', //class added to menu's outer DIV
customtheme: ["#1c5a80", "#18374a"],
contentsource: ["smoothcontainer", "smoothmenu.html"]
})

</script>

</head>

<body>

<div id="smoothcontainer"></div>


</body>

</html>


This would be smoothmenu.html:


<div id="smoothmenu-ajax" class="ddsmoothmenu">
<ul>
<li><a href="/">Home</a></li>
<li><a href="#">About Us</a>
<ul>
<li><a href="mission.html">Mission</a></li>
<li><a href="contact.html">Contacts</a></li>
<li><a href="docs.html">Policies/Documents</a></li>
<li><a href="achievements.html">Achievements</a></li>
<li><a href="newsltrarchive.html">Newsletter Archive</a></li>
<li><a href="sponsor.html">Sponsors</a></li>
<li><a href="volunteer.html">Volunteer</a></li>
<li><a href="referee.html">Referee</a></li>
</ul></li>
<li><a href="#">Recreational</a>
<ul>
<li><a href="registration.html">Register Now!</a></li>
<li><a href="recteam.html">Recreational Divisions</a></li>
<li><a href="tinytwister.html">Tiny Twister Divisions</a></li>
<li><a href="adultleague.html">Adult League</a></li>
<li><a href="futsal.html">Futstal</a></li>
<li><a href="camps.html">Camps</a></li>
</ul></li>
<li><a href="#">Travel/ODP</a>
<ul>
<li><a href="travel-eval-tryouts.html">Academy Evaluation/Travel Tryouts</a></li>
<li><a href="registration.html">Register Now!</a></li>
<li><a href="travteam.html">Travel</a></li>
<li><a href="coach-td.html">Coach Carlos Florido - Technical Director</a></li>
<li><a href="odp.html">ODP</a></li>
</ul></li>
<li><a href="#">Education</a>
<ul>
<li><a href="coaches-clipboard.html">Coaches Information&nbsp;&nbsp;&nbsp;<img style="vertical-align:middle" src="images/Action-lock-silver-icon.png" height="24px" width="24px" /></a></li>
<li><a href="docs/edu/Cold%20Weather%20Guidelines.pdf" target="_blank">Cold Weather Guidelines</a></li>
<li><a href="/docs/edu/Concussions.pdf" target="_blank">CONCUSSION: A fact sheet for parents</a></li>
<li><a href="/docs/edu/US Soccer%20Youth%20Soccers%20Heat%20Guidelines.pdf" target="_blank">US Soccer Youth Soccer"s Heat Guidelines&nbsp;<img style="vertical-align:middle" src="images/new.png" width="32px" height="32px" border=0 /></a></li>
<li><a href="/docs/edu/Dehydration%20Facts.pdf" target="_blank">Dehydration Facts</a></li>
<li><a href="/docs/edu/Four%20Heat%20Conditions.pdf" target="_blank">Bodily Heat Conditions</a></li>
<li><a href="/docs/edu/Lightning%20Policy.pdf" target="_blank">Lightning Safety</a></li>
</ul></li>
<li><a href="links.html">Links</a></li>
<!-- <li><a href="/">Photos</a></li> -->
<li><a href="locations.html">Field Locations</a></li>
<li><a href="#">FAQ</a>
<ul>
<li><a href="reg-faq.html">Registration FAQ</a></li>
<li><a href="coach-faq.html">Coaching FAQ</a></li>
<li><a href="practice-games-faq.html">Practice &amp; Games FAQ</a></li>
<li><a href="concessions-snacks-faq.html">Concessions &amp; Snacks FAQ</a></li>
<li><a href="misc-faq.html">Uniforms, Pictures &amp; Misc. FAQ</a></li>
</ul></li>
</ul>
<br style="clear: left" />
</div>
jscheuer1
08-08-2012, 04:25 AM
There could be other problems but in IE 7 and later and in Google Chrome, AJAX generally will not work unless the page is live or on a local host server like WAMP or XAMP.

And it's almost guaranteed to fail in a WYSIWYG editor's preview mode.

Firefox and Opera usually work OK for local AJAX testing though.

What browser are you testing in?

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.
MrBiggz
08-08-2012, 05:03 AM
Strangely enough .. Firefox. Albeit I was doing it locally since I have no php or other scripting language in the code yet.

I threw it up on my server and it worked. Ok, I'll have to keep this one in mind!

Oh .. WYSIWYG? People use that? I get down and dirty with Notepad++ :D

Thanks for the insight!

Regards!