1

I am building a web application that will have a fair bit of forms. The html forms are generated using php.

One of the things I came across is this:

I have a drop down box for the user to select his country. Once he selects the country, a call is made to the server to fetch a list of states within that country and populate it in a drop down box.

Initially, I thought I could provide 2 options:

  • An enhanced jquery version where ajax is used to fetch the states and the populate it in a drop down.
  • Where javascript is not availiable, the whole page is submitted to the server and then rerendered with the new states in the drop down.

However, onChange() requires javascript. So if someone where to visit the form without javascript enabled, there's no way we can deal with the second option, since javascript is required to submit a form using onChange().

What are some ways to deal with this? My only solution at the moment is to just make javascript mandatory. Users without javascript enabled will see a message saying that the page will not work properly.

Some sites:

  • Hotmail.com - Refuses to show anything except a "javascript is required message"
  • Facebook.com - Tells us we should use the mobile version of the site.
  • Google Maps - Does not work. No message to say javascript is required.
  • Gmail - Falls back to basic html.
  • Google account - Does not work. No message to say javascript is required.

Is it acceptable to require users to have javascript enabled at the current state of the web (august 2011)?

Just came across this possible solution: http://cita.disability.uiuc.edu/html-best-practices/auto/onchange.php

I could perhaps add a button which the user can use to select their country. This should allow us to reload and render the form with the states drop down without any javascript.

Improve this question

5 Answers 5

Reset to default
1

You can provide a drop-down of states and tell the user to leave it blank if not applicable. If JavaScript is enabled, it can remove the drop-down until a country where it is applicable is selected.

No, it is not acceptable to require JavaScript; many security-conscious users use NoScript, for example, and would prefer not to turn it off.

Improve this answer
Sign up to request clarification or add additional context in comments.

8 Comments

The problem is that the list of states will depend on which country they have selected. I don't think it would be very user friendly if we put every single state in the world into the drop down.
In these days of jQuery I've go to wonder how broken/weird the web would appear with noscript
@phpdev: Then put all the fields before country on one page and after they submit that, you know their country and can display the rest of the fields.
@Matthew Lock I'll give you a hint: Very broken. ;)
@phpdev: It's true it's not user-friendly, but it's more user-friendly than blocking people without JavaScript enabled. Perhaps you could have a notice saying that JavaScript will make it nicer, but that they don't have to have it enabled.
|
1

By default you should load all possible values into the second dropdown, then clear them out on page load with Javascript. That way people without Javascript enabled can still choose the correct option.

I'm guaranteed to take flak for this, but whether you support no-JS or not should be your call. If you think your userbase is likely to have a sizeable portion of people who disable JS, then you should give them a site that works, but not optimally. If you think most of them will be running with "normal" (air quotes are important there) browsers, then you may consider dropping support for no-JS users.

Improve this answer

Comments

1

I am NOT a professional developer, so take my input accordingly. Here are my observations:

  • I support a website for a wedding cake vendor. Upon observing the competition, all the more appealing sites are embellished (tastefully) with slideshows, dropdowns, animations, interactive form validation, etc.

  • When scouting for methods to incorporate these features into our site, I found that mostly every classy method was based in javascript.

  • Figuring it was better to present ourselves as the classy act we are (humble smile), I have decided to require users to have javascript enabled. We've been up for 7 years, and I have not received any complaints. All work on mobile devices.

Improve this answer

Comments

0

A compromise option is to start with your State drop-down populated with the states of whatever country your business is in, e.g., all US states, with an extra option (preferably at the top of the list) that says "Other, non-[yourcountrynamehere]". Next to the State drop-down have a text input where the user can type the name of their state if it's not in the list. If JavaScript is enabled then on document-ready you can hide the text input and go with your Ajax solution. Without JavaScript the user has a fully functional page that doesn't even need a reload.

Improve this answer

Comments

0

What I ended up doing is to add a button beside the drop down that says "select country". Users without javascript will see this button. Upon clicking it, the page will reload with the list of states rendered.

For users without javascript, this button is hidden, and selecting a country will automatically render a new drop down containing the relevant states.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.