RoR with JavaScript disabled - javascript

Is there any fallback mechanisms in Ruby on Rails 3.2 and 4.0 when someone has JavaScript disabled?
How would an application react, specifically when using ajax request. Would it fallback to normal requests?
I ask this because I need a website which also can handle requests from text browsers for disabled people.
What are some strategies if there is no default fallback.

See this post. Stop loading the page if Javascript is disabled
In general I can't really think about any fallback mechanism here - note that huge part of requests done by rails are in fact ajax requests, as it is impossible to send PUT or DELETE over (Instead of delete request, rails send ajax post request with data: {"_method"="delete"}).
In short, for me disabling JS will break the page heavily, I'm gona test it today.

I'm not well experienced with RoR, but I suspect this is more a question of how you design your front-end architecture. My limited understanding is that RoR didn't provide any javascript "out of the box"; it's default state is to create views that produce flat HTML, which you can dress up how you like with JS and CSS.
Your HTML should be written such that the user should be able to get to all the content they are most interested in, without having to rely on JavaScript to do it. This means you should only use JS to augment the experience. In the language of common front-end practice, do progressive enhancement.

After some research I found the answer:
Ruby on Rails uses unobtrusive javascript to accomplish this. Any Ajax request will then gracefully "degrade" to a normal POST or GET request if javascript is disabled. The only action that will not be working out of the box is delete since it is the only request that is not fully supported by all browsers natively and needs js.
Find out more about that in that railscast: http://www.youtube.com/watch?v=t_MBLfrKTiE

Related

Automating an aspx webpage with javascript

I have a little work project I'm trying to solve. It involves automating data entry into a web-based database (ASP page). Part of the data entry requires clicking on a button to show a form. The button makes a call to WebForm_DoPostBackWithOptions(). I've been looking into trying to simulate the form POST using Javascript, but I am getting the impression it's a difficult thing to pull off, as I see that you need to supply the hidden VIEWSTATE data in the post, which just seems like a lot of work for little gain.
Anyway, I'm strictly limited to using IE 8, client-side scripting, and no external libs. There is no API or provision for automated access to the web database. The environment is totally Windows, and I do have .NET available. At this point, it seems the only viable option is to try to use a .NET WebBrowser object from javascript.
Are there any other ways of going about this?
Are you able to use xDomainRequests to post the data to the ASP page, and then handle it there? It's pretty much the same thing as ajax, except some versions of IE (8 included) don't support ajax.

Which Java Web Framework allows Cross-Domain Javascripting (http proxy)?

So just a quick intro, I am starting to explore Vaadin, and it's absolutely perfect. Previously, I was juggling PHP, Perl, Ruby, and Jquery for designing rich client web application. It didn't work out too well, as I've burnt out from trying to fix cross browser issues (aka get-it-to-work-on-IE-damn-it), handling server-side, client-side, and building a robust communication between the two tier had lot of code not related to application logic....by the time I was burnt out, only tiny bit of application logic was implemented.
Vaadin seems like the answer to my problem as it only requires Java and built on top of GWT.
However, I am curious how I can incorporate Cross-Domain Javascripting ? Back in LAMP environment, I had a CGI proxy script that loaded external URL, and injected JS into the proxy-loaded page. I used the CGI proxy script, as it rendered Javascript of the external URL well. Is there a class or package for Java or a specific Java web framework similiar to Vaadin that makes this possible ?
Thank you.
If you want to avoid any kind of proxies, and thereby keep a full context on each 'side', then you should choose easyXDM. To see it in action try http://easyxdm.net/current/example/methods.html
This fully supports all browsers, and has a neat RPC interface that lets you call methods and pass data between the domains.
If you plan to support IE6/7 then you should also try the upcoming version.
Even though the current version is fast (when used with a dependency), this one is even faster - actually nearly as fast as postMessage in never browsers!
You can easily implement the functionality yourself.
a proxy for cross domain javascript is really straightfoward.
It's just creating a request equivalent to the ajax request you want and direct it to the other domain.
ExtJS has what they call a "ScriptTagProxy" which may or may not be of use to you...
Here's a few more links about this:
http://xant.us/ext-ux/examples/css-proxy/
http://www.extjs.com/forum/showthread.php?17691-Cross-domain-Ext.Ajax-Ext.data.Connection

Is JavaScript validation bad?

It has been long time since we have been validating our forms using JavaScript. I am sure this must be the case with most other developers.
Question:
What if the user (or probably a bad guy) disables JavaScript?
You are lost!
Is JavaScript validation worth of it?
Should we ever use it now?
Are there any solutions to this?
Correct me if I am wrong.
Is JavaScript validation worth of it?
Yes, as it provides a better user experience and preserves bandwidth.
Should we ever use it now?
Yes, for the aforementioned reasons.
Are there any solutions to this?
Yes, use server-side validation as well.
What if the user (or probably a bad guy) disables javascript?
As said before: Simply do not rely on the client. Never do so. Check everything on the server again.
Should we ever use it now?
Yes - so the user immediately sees what's wrong. Otherwise he had to post back the data first which may take a while. By the way you reduce traffic to your server.
It's simply more inuitive.
//EDIT:
BTW: The ASP.NET ValidationRules contain both client-side and server validation as far as I know.
Javascript validation is good because it provides a better user experience.
You should however never rely on it and should validate on the server regardless.
If you're looking to save time, go with server-side only. If you want better performance and user experience, add client-side validation afterward. Never rely on client-side validation, for the reasons you state. All critical validation should occur on the server ... even if duplicated on the client.
JavaScript improves user interaction for your product or service. Users interaction (user input and machine response or vice versa) is a vital characteristic of our applications. As we all experienced, products are getting more interactive ever than before. And this interaction part can (only) be crafted in JavaScript (ActionScript for Flash Player). We would all agree with this - there is always a calculated amount of work that can be transited to the client side (machine) to avoid calls without bothering them to send to the server(s). There are many many applications which are heavily dependent on client-script scripting. And if they found you do not allow required scripting they asked for it leaving a message in noscript tag. But I think everyone wants to have it enabled as we all fire up a tab with Gmail, Facebook, etc.
However, this still should not be ignored as we are keen to grap every single opportunity (audience/customer) and work with is at least better than falling apart. It still works!
As a Microsoft Development Platform user, there is a convenient solution on .NET platform. That don't require dual effort on such issues. Make use of your client-side validation while scripting is disabled by using Page.Validate() and Page.IsValid.
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsPostBack) {
Page.Validate(); // If you missed, then you got the second chance ...
}
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
if (Page.IsValid) { // Confirm you do a proper validation before moving to perform any process
Response.Write("Done!");
}
}
I hope this will help.
Client-side (Javascript) validation is about usability, nothing else. If the cost of implementing is not worth the perceived increase in usability, then don't spend the time on it. These days it's pretty easy to do though!
I don't think you can do without server-side validation, however, since this is the only thing that provides you with any security.
Using JavaScript is not wrong. We've been using it since a long time. It is used for applying client-side validations.
Still, we should implement server-side validation so that a bad guy would not be able to break the application.
If you learn only one thing from this topic, let it be this:
Never — under any circumstances — trust data from the browser and always validate request data on the server-side.
Should we ever use it now?
Yes, definitely. You do not need to validate an empty field on the server side. It is not something like validating an email's availability (uniqueness of email). If you are going to reject that empty field anyway, there is no point of sending it to server and making
server do extra work for it.
You have to validate it on sever-side, javascript is good to validate form, but people can disable javascript, or use another javascript to hack it, so validation on server-side is a must.
JavaScript is useful for client side validation. But you cannot rely only on them. You must use server-side validation against the posted data. JavaScript just prevents unnecessary posts to the server.
You can make server and client-side validation pretty painless by using a framework that supports both. In the past, for ASP.NET I used the Peter Blum validators:
http://peterblum.com/
With this, you drop the validation controls onto your page, hook them up to the inputs (textboxes, drop down lists etc), and specify the validation properties (minimum length, required, error message etc). When the page runs, the framework spits out equivalent code for both the client (JavaScript) and server (ASP.NET) to perform your validation.
Without such a framework, as other posters have pointed out, validation can be laborious.
I'd be interested to know of anything similar for PHP or other technologies.
You should have multiple layers of validation.
Validation on the client Side
This is definitely useful because validation can be done without having to go to the server. Requests get to the server once they are validated - saves some traffic.
Validation on the server side
If javascript is disabled then the server should also incorporate a level of protection - validation in order to disallow erroneous requests.
In a multi-tiered / service orientated environment validation should exist on multiple levels to allow for better reuse while still maintaining a secure application. Validation on the client side, whether in a desktop app, or web site/application should be there for a better user experience to prevent postbacks to the server everytime for validation, hence costing more bandwidth and user time. If client-side validation cannot be moved entirely to the front end then consider using ajax for a partial postback to a server side validation routine, while retaining a better customer experience but allowing a programmer to maintain the validation rules centrally.
Second to the client side, but more importantly, server side code should validate the data before persisting it via a data layer or passing it to another server side method/service, to employ business rules around the data and help prevent errors in data integrity. Lastly, the persistence layer itself (the immediate interface to the database or other storage mechanism) should validate the data being stored, again to prevent errors in data integrity and possibly further business rules. The last thing you want is a data store with useless data.
Employing this method will keep you data secure and integrity in line. On reuse of either you persistence layer, your data layer or your front-end presentation thereafter, in your own site (or via a web service, desktop application or mobile app), if designed properly, these validation routines are already in place and can be re-employed. This should prove to be of great benefit to you alone, and your colleagues and your management, if you happen work in a team.
Is JavaScript validation worth of it?
well,yes it is .Buy using JavaScript validation you can easily take any kind information about client site more over JavaScript validation provides a better user experience
Should we ever use it now?
Yes you can because of user can see there error or what's they do wrong on real-time
Are there any solutions to this?
yes you can also use server-side validation.But sometime its take more time .it's also insecure
Javascript is a client-side scripting language. Therefore we can use client-side validations by using it. It helps to reduce the load that goes to the server-side. That's why js validation is worthy. And that is the reason for use it for client-side validations. But we should not only depend on js validations. Because the client can turn off the js engine at any time. If so, it causes a big problem.

When NOT to use AJAX in web application development? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 6 years ago.
Improve this question
I'm building a web application with the Zend Framework. I have wanted to include some AJAX type forms and modal boxes, but I also want my application to be as accessible as possible. I want my application to be enhanced by AJAX, but also fully functional without AJAX.
So as a general guideline...when should I not use AJAX? I mean, should I bother making my application usable without AJAX? Or does everyone have AJAX enabled browsers these days?
If you mean "accessible" in the ADA sense, AJAX is usually a no-no - your site should provide all its content and core functionality using only standard (X)HTML and CSS. Any javascript used should merely extend the core functionality, and your site should be coded to work elegantly in the absence of a javascript-enabled browser.
Examples: if you want a user to click on a thumbnail and get a full-size version of the image as a result, you can make the thumbnail a link. Then, the onclick event will fire a JQuery method that cancels the navigation behavior of the link and pops up a JQuery floating div to show the image on the current page. If the user's browser doesn't support JavaScript, the onclick event will never fire, and the user will be presented the image in a new page. The core functionality is the same with or without scripting.
EDIT: Skeleton example, sans JQuery-specific code.
<html>
<body>
Some URL
</body>
</html>
To cancel the navigation operation, simply make sure that the method invoked by the onclick event returns false at the end.
A neat example of the JQuery image popup I described can be found here.
Use ajax if it adds value for the user.
If the ajax version adds a lot more value than the non-ajax version then it might justify the expense to develop a solution that caters for both clients. Generally i wouldn't recommend doing the extra work (remember.. more code results in more maintenance).
I think one point is missing here: Use Ajax only for content any search engine does not need to know.
98% of users will have AJAX enabled browsers.
A significant percentage of those people won't have it turned on when they first visit your site though (or at all, ever perhaps).
I've seen websites that look like a blank page without javascript on. Don't be one of them. Javascript to fix layout issues is a horrible idea in my opinion. Make sure it loads and looks ok without Javascript. If people can atleast see what they are missing out on, they are likely to switch it on, but if your website looks like it's just broken, then...
I often have noscript block Flash and JavaScript until I make the decision that your site is worthy.
So be sure to tell me what I'm missing if I have JavaScript turned off.
It depends on the complexity of your web application.
If you can, having it functional with javascript disabled is great, because it makes your application usable not only by users on js-disabled browsers but also by robots. The day you decide to write an application to automatically fill your forms, for example, you don't have to write an API from the ground up.
In any case, do not user AJAX for EVERYTHING! I have just inherited a project that basically consists of a single page that is populated by a ton of AJAX calls and I can tell that you just thinking about it gives me physical pain. I guess the original developer didn't like the concept of using the back/forward button in the browser as a mean of navigation.
Unless you are targeting mobile devices or other non-standard web users, you can be fairly sure that the vast majority has Javascript enabled, because most major sites (including SO) rely heavily on it.
I want my application to be as accessible as possible.
You can do things like rendering your modals and forms as a page that can operate standalone.
The AJAX version pulls the template into a modal/container, the standalone version checks if it's an AJAX request and renders the page including the header/footer (this can occur from the same URL if planned well)
The AJAX version intercepts the submit and does AJAX submission then provides an inline thank you, the non-AJAX opens a thank you page. Once again you can likely use the same pages for each of these functions if thought out correctly.
Reusing templates and URL's helps avoid additional maintenance for the AJAX/non-AJAX versions.
I want my application to be enhanced by AJAX, but also fully
functional without AJAX.
Thinking through the structure of your URLs and templates can go a long way towards this, if you make most of your AJAX requests pull in completely rendered templates (as opposed to just data) then you can usually use the same URL to serve both versions. You just serve only the guts of the modal/form to the AJAX request and the entire page to a regular request.
When should I not use AJAX?
You should not use AJAX if doing so will cause a poor experience for a significant portion of your user base (there are of course techniques that can be used to mitigate this)
You should not use AJAX if the development time associated with implementing it will be too significant to justify the improvements in user experience
You should not use AJAX for content which has significant SEO value without implementing an appropriate fallback that allows it to be indexed (Crawlers are improving constantly but it's still a good idea)
I mean, should I bother making my application usable without AJAX? Or
does everyone have AJAX enabled browsers these days?
I'd say a lot of the time it's unnecessary as the vast majority of users will have AJAX enabled browsers, but there are scenarios where it's critical such as SEO optimization or when a large portion of your user base is likely to use browsers that are less likely to support Javascript as well or where they're likely to have Javascript/AJAX disabled.
A few examples of these scenarios:
A website for a company or government that uses an outdated browser as standard
A website where a large portion of the users may be disabled in a manner that may negatively impact their experience such as a website for vision or motor-skill impaired people may be negatively impacted by updating content via AJAX especially if it occurs rapidly.
A site accessed regularly via a less common device or browser that will cause a negative impact to a large portion of users
So what should I do?
Think about who is going to be using the site, how they're going to access it, and what they're going to access it with. Also try to think about not just the present but also the future.
Design the site in a manner that will cater to the majority of these users.
Think who will gain and who will loose based on my decision to use AJAX and if in doubt have a look at your analytics data to help weigh up the decision and if you lack the data it may be worth updating your tracking and obtaining a sample to aid the decision
Think does my decision to use AJAX cause any contradictions with core requirements for this project
Use AJAX to enhance content where possible as opposed to making it mandatory ie the content should work with or without JS/AJAX
Consider the additional development time involved with the use of AJAX (if any)
My experience is, we should use ajax after it works without it. For a couple of reasons.
First, if something breaks in the ajax, and you don't have it working without it, the site simply doesn't work. For example, a product list with pagination. It should work with the links alone, then use ajax when possible.
Second, for site indexing and accessibility. If it works without ajax, it's better.
And it's easier to break something (even if only for a few moments). A bad piece of code, an uncaught exception, an external library not loaded, a blocking browser extension,...
After everything works without ajax, its quite easier to add ajax. Just have the ajax catch the action, add ajax=1 and when returning the result, return only what you need if ajax=1, otherwise return everything.
In the product list example, I would only return the products and pagination html, and add to the correct div. If ajax stops working, the whole page is loaded and the customer sees the second page as it loads.
Ajax adds a lot of value to UX. If done right, the user gets a great feel when using the site, and better data usage because it doesn't load the whole page everytime.
But the question being "when not to use ajax", I would say, you should always count on it to improve UX but not rely on it for the site to work (as other users also mentioned). And nowadays we need both, great code and great user experience.
My practice is to use two main pages, let's say index.py and ajax.py. First one is responsible for generating full website, and is default target of forms. Other one generates only output specific for adequate ajax query. Logic behind both of them is the same, only the method of generating output is a bit different.
In jquery I simply change action parameter when sending a request. It works both with and without ajax, although long time have I not seen someone with disabled js and ajax.
I like the thought of coding your application without JavaScript / Ajax and then adding it in later to enhance the UI without depriving users of functionality just because they don't have JavaScript enabled. I read about this in Pro ASP.NET MVC but I think I've seen it elsewhere in reading about unobtrusive JavaScript.
You should not make your service bloated with web 2.0 effects like accordion, modal/etc forms, image zoomers etc.
Use modern tech smarter (AJAX is one of them) and your users will be happy. Do not fear AJAX -- this is very good thing to make user expirience smooth. But don't do things because you like it - do them because your user need it ;)
When you want to make a website that looks like a website, not a fugly imitation of a desktop app?
You should not use AJAX or JavaScript in cases where:
your system needs to be accessible
your system needs to be search friendly
However, by using a modern JS framework with some solid "unobtrusive" practices, you can progressively enhance pages so that they remain accessible and search-friendly while offering a slick UI to users.
This totally depends on the type of application or feature you're developing. If it is crucial that the application is accessible despite the absence of Javascript, then it would help to have fallback methods (i.e. alternative forms) to allow your user to use said functionality/feature. For that, it will require you to invest some of your time developing methods for collecting information not just using client-side scripts but also on the server-side.
For miscellaneous features that only serves to enhance user experience, it's mostly not worth it to develop fallback methods.
There's no reason to totally not use AJAX. AJAX helps minimize your traffic after all.
You can if you wish always use AJAX and update the history state using Push State or for more compatibility use the hash with none HTML5 compliant browsers.
with this you can have your server load a page then javascript read the document.hash and resume the state of the application base on the state of the hash.
for example i got to /index.html i click into something for example a client to open the view client you can change the hash to #/view/client/{client_id}/ then if a reload or go back using the browser the hash with change and you can use the onhashchanged event to capture it and match the sites state to the new hash then same if a favorite a certain state
A couple of other scenarios where one may be better off NOT using AJAX:
Letting someone to log into the web application. Use traditional form submit instead.
Searching and returning more than a few 100 rows from the database. Either break the process down or let the server side language handle it.

Can you use Silverlight with AJAX without any UI element?

I know you can just use CSS to hide the DIV or Silverlight Plugin, but is there a way to instantiate a Silverlight Component/App using JavaScript that doesn't show any UI element at all?
There is alot of great functionality in Silverlight, like MultiThreading and compiled code, that could be utilized by traditional Ajax apps without using the XAML/UI layer of Silverlight at all.
I would like to just use the standard HTML/CSS for my UI layer only, and use some compiled .NET/Silverlight code in the background.
Yes you can, and some of the reasons you make makes perfect sense. I did a talk on the HTML bridge at CodeCampNZ some weeks back, and have a good collection of resources up on my blog.
I also recommend checking out Wilco Bauwers blog for lots of detail on the HTML bridge.
Some other scenarios for non visual Silverlight:
Writing new code in a managed language (C#, Ruby, JScript.NET, whatever) instead of native (interpreted) JavaScript.
Using OpenFileDialog to read files on the client, without round-tripping to the server.
Storing transient data securely on the client in isolated storage.
Improving responsiveness and performance by executing work in the background through a BackgroundWorker or by using ordinary threads.
Accessing cross-domain data via the networking APIs.
Retrieving real-time data from the server via sockets.
Binding data by re-using WPF's data-binding engine.
Yes. I think this is particularly intriguing when mixed with other dynamic languages -- but then, I'm probably biased. :)
Edit: But you'd need to use the managed Javascript that's part of the Silverlight Dynamic Languages SDK and not the normal Javascript that's part of the browser.
Curt, using Managed JavaScript would still require you to have some Silverlight/XAML display layer being visible on the page, correct? Is there a way to entirely get rid of any Silverlight/UI element from being displayed?

Categories

Resources