I have some functionality on my page that JavaScript is currently handling. I want to make my page compatible with non-Javascript users. Is there a way I can say "If JavaScript is enabled, use my JavaScript routine, otherwise do a Postback and let the server-side handle it?"
A:
You might try leveraging the noscript html tag...
http://www.w3schools.com/TAGS/tag_noscript.asp
this doesn't handle the postback stuff, but you might offer a control to display to fire server side code.
sgmeyer
2009-05-13 20:35:17
+4
A:
I have to presume that whatever triggers this postback or client-side behaviour (depending on javascript being available or not) is a html submit button?
If it is, I would attach the javascript handler for the client-side stuff to the button and have the handler return 'false' to prevent postback. When javascript is not enabled, the button will perform the standard html form function of triggering a postback and that will then let you do things server-side instead.
You can do a similar thing for links by having javascript run on the link click event to do client-side stuff but just follow the link in the event javascript is not available.
These methods are a bit more graceful in how they react to the browser not having javascript as they fall back to standard html form behaviour and require no code to detect javascript - it simply ignores your javascript and submits the form as it should.
Regarding checkboxes, be aware that the default behaviour in non-javascript enabled pages is not to post back on changes. If you change the state of a check-box, you always have to hit the submit button to postback, you simply can't do a postback on checkbox state change without javascript.
Several controls in asp.net (including drop down lists) have the option to auto-postback upon client change, this is done via javascript and if that is not available the only way to gracefully degrade is to have a button that the user clicks to force a standard html postback so your server can respond to the changed control state.
If you find you are struggling to have a coherent 'flow' in your UI if you don't have the auto-postback on checkboxes/combos etc then you might need to rethink your UI design and move to a more wizard-based layout.
I disable auto-postbacks on those types of things anyway as it is horrible for the user, which is a shame as you are going to great lengths to give them a usable experience when their browser is not using javascript.
Neil Trodden
2009-05-13 20:40:05
Nice, I think this is what I need. Let me play around with it a bit. Thanks a lot!
Mike C.
2009-05-13 20:48:16
Hi Neil, can you show an example of how to do this with a CheckBox control? When I return false on the onchange javascript event, it doesn't actually change the checked state.
Mike C.
2009-05-15 05:05:30
I'll add to the answer but I don't think you'll be able to do this.
Neil Trodden
2009-05-15 09:57:43
I've added a bit to the answer. In short, you can degrade gracefully if you use auto-postback on checkbox changes but it may involve a rethink of the UI which is probably a good thing anyway as postback on those changes is simply not what the user expects and is horrible.
Neil Trodden
2009-05-15 10:06:26
Neil, thanks for the addition. The reason I want an event to occur when they click a checkbox is because I want to enable or disable a required field validator for a textbox. The checkbox is an "I Don't Know" option.
Mike C.
2009-05-15 13:19:54
You're not going to be able to validate that client-side if javascript is disabled so your validation will be server-side only. With that in mind, server-side you could see that they have checked a box that makes some field(s) irrelevant so you will be able to process the form.Of course, having the box grey-out when they click the checkbox is a nice thing to do but to do that you have to manipulate the DOM client-side and the *only* way to do that is with javascript. You're aiming to degrade gracefully but the user will not have as nice a user experience. As long as it works though.
Neil Trodden
2009-05-15 19:24:04
A:
I recommend you read up on using unobtrusive JavaScript, which the solutions proposed abide by. The fundamental idea is that JavaScript and Ajax should extend your user experience rather than being a requirement. Your JavaScript code should hijack events like clicking a button and prevent the default behavior, since the script should handle the processing and responses in real time, within the browser.
Andrew Noyes
2009-05-13 22:59:16