onclick event...

Having problems with DHTML Menu? There is usually somebody here who knows the answer.
Post Reply
neolus
Beginner
Beginner
Posts: 6
Joined: Thu Nov 13, 2003 12:26 pm

onclick event...

Post by neolus »

Hi,

I would like to add an onclick event to my menu and submenu links. And as I am not good in html or javascript, I have some problems.

When clicking in the menu, I want it executes this function (as it would appear in htlm)

Code: Select all

<a href="www.mywebsite.com" onclick="exit=false">Link</a>
in order no to load an exit popup.

At this time I only can make

Code: Select all

aI("text=Home;url=http://www.mywebsite.com/;status=Back To Home Page;");
or

Code: Select all

aI("text=sub1;url=page1.htm;");
I tried this code without success

Code: Select all

aI("text=sub1;url=javascript:exit=false; document.location.href='page1.html';");
Please help me... I'm getting mad
User avatar
John
 Team
 Team
Posts: 5967
Joined: Sun May 19, 2002 8:23 pm
Location: Phoenix, AZ
Contact:

Post by John »

See http://milonic.com/forum/viewtopic. ... ht=onclick for one. Search would have found this for you (along with a lot of other topics on the subject).
John
neolus
Beginner
Beginner
Posts: 6
Joined: Thu Nov 13, 2003 12:26 pm

Post by neolus »

ok. I read that post before but it did not help me as I do not understand.

I tried this:

Code: Select all

aI("text=sub1;url=javascript:exit=false; document.location.href='page1.html';;")
but it does not work... it displays a blank page with exit=false written.

Does it need to create a js function ?
neolus
Beginner
Beginner
Posts: 6
Joined: Thu Nov 13, 2003 12:26 pm

Post by neolus »

I've searched in the forum and tried many expression and even create a js function... without success. I am not good in informatic and I imagine the solution is easy for you.
So if you can tell me what is going bad in my code, it would be nice. ;)
neolus
Beginner
Beginner
Posts: 6
Joined: Thu Nov 13, 2003 12:26 pm

Post by neolus »

is anyone could help me?
User avatar
kevin3442
Milonic God
Milonic God
Posts: 2460
Joined: Sat Sep 07, 2002 12:09 am
Location: Lincoln, NE
Contact:

Post by kevin3442 »

Hi,

I can probably help you, if you can give me a little more detail.

As you've described it, you want a function that, when a menu item is clicked, will set exit equal to false, and set the browser location to 'page1.html'. I'm going to assume that you don't always want to go to page1.html, but that you'd like to be able to specify the page to go to... correct? I also wonder if you want to be able to specify the value for exit, or is your plan to always set it to false when any menu item is clicked?

Kevin
neolus
Beginner
Beginner
Posts: 6
Joined: Thu Nov 13, 2003 12:26 pm

Post by neolus »

ok. Thanks.

So what I want to do. I have an index.php page where I have some links and where I want to put a dynamic menu. But I have in my webiste an exit popup whose code is:

Code: Select all

<script language="javascript">
var exit=true;
function exitwindow()
{
var url = 'http://www.google.com';
var win = 'toolbar=0,directories=0,menubar=0,scrollbars=1,resizable=1';
if (exit) {
open(url,'WindowName',win); } }
</script>

<body onUnload="exitwindow()">
...
</body>
In order not to load the popup each time I click a link in the webpage, I write this html tag

Code: Select all

<a href="http://websites.milonic.com/mywebsite.com/mypage.htm" onclick="exit=false">My Link</a>
So that the exit popup is only loaded when I refresh the page or when I go to another website.

My problem in the milonic menu is to pass the variable "exit=false" in the url.

Is there a trick to do this or is it necessary to create a javascript function ?

Thanks for your help.
User avatar
Andy
Milonic
Milonic
Posts: 3308
Joined: Sun May 19, 2002 8:23 pm
Location: Menu Developer
Contact:

Post by Andy »

Here's a quick tip.

If you need to add complex JavaScript, this may intefere with the aI() parser. So what you could do is enclose your code inside back quotes. Like this.

Code: Select all

aI("text=sub1;url=`javascript:exit=false;document.location.href='page1.html';`")
Cheers
Andy
User avatar
kevin3442
Milonic God
Milonic God
Posts: 2460
Joined: Sat Sep 07, 2002 12:09 am
Location: Lincoln, NE
Contact:

Post by kevin3442 »

I'd probably use a separate function to set exit; that way, it'll be less code in your aI() definitions and you can more easily modify the system later. Here's what I would suggest:

(1) Define exit at the top of menu_data.js, along with the other globals, and add a function to menu_data.js, like so:

Code: Select all

var exit = true;

function setExit(state)
{
  exit = state;
}
(2) On menu items where you want to set the exit value, use the new clickfunction property to call setExit() and set exit's value. Like so:

The following menu item sould set exit=false, then go to page1.html:

Code: Select all

aI("text=sub1;url=page1.html;clickfunction=setExit(false);")
This one would set exit=true and go to http://www.yahoo.com:

Code: Select all

aI("text=sub2;url=http://www.yahoo.com/;clickfunction=setExit(true);")
This one would go to page3.html but not change the state of exit:

Code: Select all

aI("text=sub3;url=page3.html;")
Just an aside: It seems to me that there must be an easier way to do what you want to do. Instead of setting exit to true by default and always having to set it to false as a user navigates your site, why not set it to false by default, and only change it to true when you have to? Just a thought.

Hope that helps,

Kevin
neolus
Beginner
Beginner
Posts: 6
Joined: Thu Nov 13, 2003 12:26 pm

Post by neolus »

Andy,

Thank you for your tips. It is one that I did not try. And it works.

Kevin, thank you for your help. I will study your option. It is more flexible as you say and easier to manage. But I don't know it will work with other classical <a> tags in my webpage.

Thank you all.
User avatar
kevin3442
Milonic God
Milonic God
Posts: 2460
Joined: Sat Sep 07, 2002 12:09 am
Location: Lincoln, NE
Contact:

Post by kevin3442 »

Hi Neolus,
neolus wrote:...Kevin, thank you for your help. I will study your option. It is more flexible as you say and easier to manage. But I don't know it will work with other classical <a> tags in my webpage...
You're welcome. I think the simpler approach would easily work with the other <a> tags. If you set exit=false; in menu_data.js, then the default state would be not to open your exit popup. That way, none of your links or menu items that navigate internally within your site would need to bother setting the exit state... that makes for less code and a decreased chance that you might forget to set the exit state in a link or menu item (ever done that before?). All you would have to do is setExit(true) for links or menu items that leave your site (which I assume is your intent). In an <a> tag, you'd do this:

Code: Select all

<a href="http://websites.milonic.com/someothersite.com/" onclick="setExit(true)">the link</a>
Hope that made sense,

Kevin
User avatar
Hergio
Milonic God
Milonic God
Posts: 1123
Joined: Wed Jun 12, 2002 7:46 pm
Location: Rochester, NY

Post by Hergio »

Just thinking out loud, but wouldnt that not allow him to catch the event of someone just typing in another URL into the browser window? Or closing the window?
Dave Hergert
Software Engineer
"Helping to make the menu better, one :?: at a time."
User avatar
kevin3442
Milonic God
Milonic God
Posts: 2460
Joined: Sat Sep 07, 2002 12:09 am
Location: Lincoln, NE
Contact:

Post by kevin3442 »

Hi Dave,
Hergio wrote:...wouldnt that not allow him to...
Yes, it would not... no flies on you Dave! I had thought of the problem with manually typing in the url, but didn't mention it because it sounded to me like he must have lots of links to other sites (at least that's how I read it) and was most concerned about those. To me, the trade off in ease of use would be worth skipping the instances where someone types in a new url... but that's just me. Still, you're right to point it out, to make sure all of the ramifications are known.

Regarding the closing of the browser window: I had also thought of that one, but didn't mention it for several reasons: (1) Depending on what you're doing, onunload can be unreliable whan closing the browser window (e.g., alerts, prompts, and confirms get eaten in NS, Opera, and others; scripting for form processing gets messed up because the document, along with the form, is suddenly gone). (2) Setting exit=true as the default state would indeed cause the popup to appear when closing the window. But using onunload to open a popup window when you close the current one also causes the popup to appear when you refresh/reload the current window... a most annoying side effect! (I suppose you could try to code around that, but many sites that use popups don't bother in my experience). (3) To my way of thinking, when I close a site, I'm done with it and don't want to see another page from it, so I am morally bound not to promote the proliferation of popups that appear when you close a window! ;) But, in the interest of completeness, your remarks are right on the money Dave.

Cheers,

Kevin
User avatar
cubefree
Super Advanced
Super Advanced
Posts: 82
Joined: Fri Aug 01, 2003 3:16 am
Location: Seattle, WA
Contact:

clickfuncton not firing

Post by cubefree »

Forgive me for piggy-backing onto your topic, as mine is slightly different... but my clickfunction does not seem to be firing. I've added an alert, but nada. I'm doing this only to show state on my sub-navigation that uses anchor names. Pagematch does not seem to work if you click on link using an anchor name tag. After the page loads, try 'online invoicing' or 'data conversions'. The page should reload.

Some info:

http://www.cubefree.com/dev/services/pr ... helftalker

Code: Select all

function resize() {
  alert('reloaded');
  document.location.href = history.go(0);
}

var wm = 'services/webmarketing';
var ts = 'services/techservices';
var pc = 'services/printcmu';
var pm = 'services/projectmanagement';

// bullet graphic (pi ~ pageimage)
var pi = ''; //'<img src='+DOM+'images/graphics/v_bullet.gif hspace=3 border=0>';

with(leftStyle=new mm_style()){
padding=0;
menuwidth=150;
align="right";
oncolor="#D3714E";
offcolor="#999999";
pagecolor="#C94522";
fontsize="10px";
fontstyle="normal";
fontfamily="Verdana, sans-serif;";
onbold=0;

if (ie) {
	overfilter="Fade(duration=2.0);Alpha(opacity=100)";
	outfilter="randomdissolve(duration=0.3)";
	}
}

var menu_top  = "text=<img src="+DOM+"images/spacer.gif width=150 height=18 border=0>;"
var sub_top   = "text=<img src="+DOM+"images/spacer.gif width=150 height=10 border=0>;"
var dasher    = "text=<img src="+domlav+"dashedline.gif width=150 height=1 vspace=5 border=0>;"
var sepp      = 'separatorsize=1;separatorpadding=5;';



with(milonic=new menuname("services")){
style=leftStyle;
top=158;
left=leftnav_left;
menuwidth=150;
alwaysvisible=1;
orientation="vertical";
followscroll = "55,50,15";

aI("image="+domlav+"services.gif;url="+DOM+"services/index.php;separatorsize=0;"); 
aI(menu_top);

aI("image="+domlav+"webmarketing.gif;overimage="+domlav+"webmarketing_f2.gif;url="+DOM+"services/webmarketing.php;pageimage="+domlav+"webmarketing_f3.gif;pagematch="+DOM+"services/webmarketing;");

if (url.indexOf(wm) != -1) {
	aI(sub_top);
	aI("text="+pi+"design \& development;"+sepp);
	aI("text="+pi+"online marketing;"+sepp);
	aI("text="+pi+"online advertising;"+sepp);
	aI("text="+pi+"search engine rankings;"+sepp);
}
aI(dasher);

aI("image="+domlav+"techservices.gif;overimage="+domlav+"techservices_f2.gif;url="+DOM+"services/techservices.php;pageimage="+domlav+"techservices_f3.gif;pagematch="+DOM+"services/techservices;");

if (url.indexOf(ts) != -1) {
	aI(sub_top);
	aI("text="+pi+"database / web applications;"+sepp);
	aI("text="+pi+"e-commerce;"+sepp);
	aI("text="+pi+"content management systems;"+sepp);
}
aI(dasher);

aI("image="+domlav+"printcmu.gif;overimage="+domlav+"printcmu_f2.gif;url="+DOM+pc+".php;pageimage="+domlav+"printcmu_f3.gif;pagematch="+DOM+pc+";");

if (url.indexOf(pc) != -1) {
	aI(sub_top);	
	aI("text="+pi+"shelf talkers;url="+DOM+pc+".php#shelftalker;"+sepp+"clickfunction=alert('reloaded');");
	aI("text="+pi+"data conversions;url="+DOM+pc+".php#data;"+sepp+"clickfunction=resize();");
	aI("text="+pi+"online invoicing;url="+DOM+pc+".php#invoicing;"+sepp+"clickfunction=resize();");
}
aI(dasher);

aI("image="+domlav+"projectmanagement.gif;overimage="+domlav+"projectmanagement_f2.gif;url="+DOM+"services/projectmanagement.php;pageimage="+domlav+"projectmanagement_f3.gif;pagematch="+DOM+"services/projectmanagement;"); 

if (url.indexOf(pm) != -1) {
	aI(sub_top);
	aI("text="+pi+"strategy;url="+DOM+pm+"_strategy.php;"+sepp);
	aI("text="+pi+"development;url="+DOM+pm+"_development.php;"+sepp);
	aI("text="+pi+"management;url="+DOM+pm+"_management.php;"+sepp);
	aI("text="+pi+"promotion;url="+DOM+pm+"_promotion.php;"+sepp);
}

}
Post Reply