onClick and href="#"

[Jez]

Hi,

I've created a function which opens a popup window containing a
calendar. When a day is clicked, the date is entered into a text box
on the parent page and the popup is closed.

The link I'm using on the parent page is ...

<a href="#" onClick="popupcal()">choose date</a>

My form is quite long, and when the popup is opened I'm returned to
the top of the page meaning I then have to scroll down again to
continue entering information.

I'm assuming this is due to the href="#" part of the link? Is there
any way I can avoid this problem?

Many thanks!

Jez

[Laurent Bugnion, GalaSoft]

Hi,

Jez wrote:

Hi,

I've created a function which opens a popup window containing a
calendar. When a day is clicked, the date is entered into a text box
on the parent page and the popup is closed.

The link I'm using on the parent page is ...

<a href="#" onClick="popupcal()">choose date</a>

My form is quite long, and when the popup is opened I'm returned to
the top of the page meaning I then have to scroll down again to
continue entering information.

I'm assuming this is due to the href="#" part of the link? Is there
any way I can avoid this problem?

Many thanks!

Jez

To cancel the link's action, you must return false in the ONCLICK event
handler.

Note that it is best to avoid # in the HREF, and instead link to a page
explaining why JavaScript should be enabled for this functionality, or
offering some workaround.

<a href="noJs.html" onClick="popupcal();return false;">choose date</a>

Laurent
--
Laurent Bugnion, GalaSoft
Webdesign, Java, javascript: http://www.galasoft-LB.ch
Private/Malaysia: http://mypage.bluewin.ch/lbugnion
Support children in Calcutta: http://www.calcutta-espoir.ch

[Richard Hockey]

<a href="#" onClick="Dofunction(); return false;">

The browser executes the OnCLick event first, and only follows the href if
the OnClick event/javascript function returns true. If you place 'return
false' in the OnClick the href is ignored. (assuming javascript is enabled
in the browser)

You can do the same sort of thing for form validation

function Validate()
{

if(form.element.value is invalid)
{
alert('element n is invalid.');
form.element.focus();
return false;
}

return true;
}

<form name="myform" method="get" action="process.asp" onSubmit="return
Validate();">

"Jez" <je**********@btinternet.com> wrote in message
news:ad**************************@posting.google.c om...

Hi,

I've created a function which opens a popup window containing a
calendar. When a day is clicked, the date is entered into a text box
on the parent page and the popup is closed.

The link I'm using on the parent page is ...

<a href="#" onClick="popupcal()">choose date</a>

My form is quite long, and when the popup is opened I'm returned to
the top of the page meaning I then have to scroll down again to
continue entering information.

I'm assuming this is due to the href="#" part of the link? Is there
any way I can avoid this problem?

Many thanks!

Jez

[Markus Ernst]

> Note that it is best to avoid # in the HREF, and instead link to a page

explaining why JavaScript should be enabled for this functionality, or
offering some workaround.

<a href="noJs.html" onClick="popupcal();return false;">choose date</a>

It is even better to write the url of the file shown in the popup in the
href attribute, so people without Javascript AND searchengines will find the
page, too.

--
Markus

[Stuart Palmer]

return false; after popupcal(); this will stop the href running.

You could also put href="javascript:popupcal();" but this won't work for non
js users so I'd suggest putting the same page the popup loads in the href,
target="_blank" and return false on the click.

So :-

<a href="page.html" onClick="popupcal('page.html');return false;"
target="_blank">date</a>

Now this is general for all popups. To ensure you cover JS and non JS
people, but don't forget, the text input bit on the parent for non JS people
won't work.

Good luck hope that helps.

Stu

"Jez" <je**********@btinternet.com> wrote in message
news:ad**************************@posting.google.c om...

Hi,

I've created a function which opens a popup window containing a
calendar. When a day is clicked, the date is entered into a text box
on the parent page and the popup is closed.

The link I'm using on the parent page is ...

<a href="#" onClick="popupcal()">choose date</a>

My form is quite long, and when the popup is opened I'm returned to
the top of the page meaning I then have to scroll down again to
continue entering information.

I'm assuming this is due to the href="#" part of the link? Is there
any way I can avoid this problem?

Many thanks!

Jez

[Grant Wagner]

Stuart Palmer wrote:

return false; after popupcal(); this will stop the href running.

You could also put href="javascript:popupcal();" but this won't work for non
js users so I'd suggest putting the same page the popup loads in the href,
target="_blank" and return false on the click.

So :-

<a href="page.html" onClick="popupcal('page.html');return false;"
target="_blank">date</a>

Given your structure, I'd go one step further and recommend:

<a href="page.html"
onClick="popupcal(this.href);return false;"
target="_blank">date</a>

Specifically, substituting this.href for page.html. That way, if you ever need
to revise the site structure, you can simply change the HREF, as you would with
an ordinary HTML link.

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 6/7 and Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html

[Jez]

Thanks all very much indeed!

Jez