Web Hosting, Design, & Coding

General discussion

JavaScript Form Action?

by LearneyLearney / March 5, 2010 12:55 PM PST

I want to use a javascript dropdown menu to navigate to various pages on my website.

However the one I've selected won't validate
(http://validator.w3.org)
because required attribute "ACTION" not specified.

Here is the script (commented out):

/*
<script type="text/javascript">
<!--
function changePage(theform) {
num= theform.URLSelect.selectedIndex;
if (num==0) { site = "/folder/index.html"; }
if (num==1) { site = "/folder/something1.html"; }
if (num==2) { site = "/folder/something2.html"; }
if (num==3) { site = "/folder/something3.html"; }
if (num==4) { site = "/folder/something4.html"; }
if (num==5) { site = "/index.html"; }
top.location.href=site;
}
//-->
</script>
*/

Here is the dropdown menu:
<form>
<select name="URLSelect" onchange="changePage(this.form)">
<option value="/folder/index.html" selected>Something Home
<option>Something 1
<option>Something 2
<option>Something 3
<option>Something 4
<option>Main Home Page
</select>
</form>

In this example, what should the form "action" be?

Thanks in advance for any helpful advise all you experts can give me.

Post a reply
Discussion is locked
You are posting a reply to: JavaScript Form Action?
The posting of advertisements, profanity, or personal attacks is prohibited. Please refer to our CNET Forums policies for details. All submitted content is subject to our Terms of Use.
Track this discussion and email me when there are updates

If you're asking for technical help, please be sure to include all your system info, including operating system, model number, and any other specifics related to the problem. Also please exercise your best judgment when posting in the forums--revealing personal information such as your e-mail address, telephone number, and address is not recommended.

You are reporting the following post: JavaScript Form Action?
This post has been flagged and will be reviewed by our staff. Thank you for helping us maintain CNET's great community.
Sorry, there was a problem flagging this post. Please try again now or at a later time.
If you believe this post is offensive or violates the CNET Forums' Usage policies, you can report it below (this will not automatically remove the post). Once reported, our moderators will be notified and the post will be reviewed.
Collapse -
On submit...
by John.Wilkinson / March 6, 2010 4:36 AM PST

Usually, you'll want to something along the following lines:

<form action="pageRedirect.php" method="get">

The reason is that some may not have JavaScript enabled, so nothing will happen when they select something from the drop-down menu. Thus, you'd need to add a Submit button, and have the page pointed to as the action property handle the redirect server-side. Thus, you'd use PHP, ASP, JSP, etc. to get the option number, from the GET/POST param, then redirect the the appropriate page.

Non-validated code such as that will still work for most, but some would visit your site and find it "broken" is JS is disabled/unsupported, particularly an issue for those using some mobile browsers and the disabled using screen readers.

John

Collapse -
How About CSS?
by LearneyLearney / March 7, 2010 1:28 AM PST
In reply to: On submit...

John, thank you for your reply...

Since I don't know php, can I solve the Non-JavaScript problem by using CSS instead?

In other words, is there a way to accomplish the same Sub Navigation Structure with ONLY CSS?

And if so, how would I convert the above example to CSS?

Collapse -
No...
by John.Wilkinson / March 8, 2010 1:41 AM PST
In reply to: How About CSS?

CSS controls styling of content, such as changing font size, positioning a block of text to the right, adding a background image, etc. It is not a server-side programming language, which is what you'd need in a case such as this. PHP, JSP, ASP, and others will all work, but CSS, HTML, and JavaScript are insufficient.

An alternative: Create a scrolling div that contains a list of all the navigation links instead of using a drop-down menu powered by JavaScript. That will work for everyone without adding a server-side language.

John

Popular Forums
icon
Computer Help 47,885 discussions
icon
Computer Newbies 10,322 discussions
icon
iPhones, iPods, & iPads 3,188 discussions
icon
Security 30,333 discussions
icon
TVs & Home Theaters 20,177 discussions
icon
HDTV Picture Setting 1,932 discussions
icon
Phones 15,713 discussions
icon
Windows 7 6,210 discussions
icon
Networking & Wireless 14,510 discussions

Tech Tip

Know how to save a wet phone?

It's not with a dryer and it's not with rice. CNET shows you the secret to saving your phone.