By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,379 Members | 1,791 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,379 IT Pros & Developers. It's quick & easy.

onClick and href="#"

P: n/a
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
Jul 20 '05 #1
Share this Question
Share on Google+
6 Replies


P: n/a
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

Jul 20 '05 #2

P: n/a
<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

Jul 20 '05 #3

P: n/a
> 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
Jul 20 '05 #4

P: n/a
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

Jul 20 '05 #5

P: n/a
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
Jul 20 '05 #6

P: n/a
Jez
Thanks all very much indeed!

Jez
Jul 20 '05 #7

This discussion thread is closed

Replies have been disabled for this discussion.