How to handle when javascript is turned off

Question

Hi,

My first web application relies heavily on Javascript and AJAX application.

Other than my Login Page, majority of the pages relies on Javascript and Ajax when submitting data to the server. I have been thinking about this, if user disables his/her javascript then my app does not behave accordingly.

I used this code in my Login page

<NOSCRIPT>
    Javascript is required to run this pages.  Please turn it on or ask help from techsupport if you dont know how to enable it
</NOSCRIPT>

Although I think not relevant, I used Spring MVC 2.5 and Jquery for the sake of information to all.

Any thoughts how others are able to handle in scenario such as this?

Answer 1

If your application is unable to work without javascript, which is fair, I think you're approach is perfectly reasonable. Let them know and keep them from entering your site until js is running. That's way better than having your app fail miserably.

That being said, if it is possible to make your app work without javascript, it's a judgement call whether it's worth the effort.

Answer 2

I think it's fine to require JavaScript to run your application. All mainstream web browsers have it today, and have had it for the last 10 years.

Using a <noscript> tag is an acceptable way of showing to the user that they need JavaScript. I don't understand what you meant about disabling the login button though... You used JavaScript to detect if JavaScript was disabled ("I used jquery to check for the presence of this tag")?

What you should do is to have the login button disabled by default, then use JavaScript (jQuery) to enable it. That way it will only be enabled if the user has JavaScript enabled.

Answer 3

I used jquery to check for the presence of this tag and then disable the Login Button.

I think it's better if you disabled the login button if it requires heavily javascript. Then just do $('#login').attr('disabled',false);. When javascript is not disabled, this will enable the login button.

And also, add some divs telling nice message, styled with css, then just remove it when JS is turned on.

But I should warn you to also check it server-side to make sure. because if I use firebug, I can enable the button easy as 1,2,3. To check server side, maybe do .ajax() calls for session or cookie. Then act accordingly. When someone logs in, check that variable.

Answer 4

What you should do is something like so

<noscript>
    <meta http-equiv="refresh" content="url=/?nojs=true">
</noscript>

This will do a html immediate refresh as soon as the headers are parsed allowing you to do something a little different.

Server Side: (PHP in my case)

if(isset($_GET['nojs']) && !isset($_SESSION['no_script']))
{
    $_SESSION['no_script'] = true; //Or cookie
}

Then as you have the variable locked in session / cookie you can throw out different pages for non JavaScript users.

Answer 5

5! If you web applications heavily relies on JavaScript my suggestion is to include <noscript> tag. Then you may inform users how to enable it: www.enable-javascript.com