AJAX validations in struts 2

Question

Can we do client side validation using AJAX in struts 2 application ? If yes, then please let me know the procedure.

Answer 1

AJAX is the mechanism by which you could invoke the server-side validation. The "J" in AJAX stands for Javascript.

You would typically make use of AJAX (and hence Javascript) to invoke some sort server-side validation that would be inappropriate for client-side validation. For example, the validation of a zip code against a table of acceptable values.

Answer 2

How would you do this? You use JS for client-side programming (including validation), it has nothing to do with the server side.

Additionally: server-side-validation via the client-side JS would be a bad idea, as all your validation code would be exposed to the user.

Answer 3

If your going to do server-side input validation then what do you need to use JavaScript for?

I'll make the assumption that you are using PHP on the server-side in which case you'll want to validate it there instead of making another unnesicary request.

If you want to use AJAX to do some server-side validation (and you'r using JQuery) this should at least get you started:

function validate(fieldName)
 {
    $.get('/validation.php',
       {'value' : fieldName.value, 'name' : fieldName.name},
       function(data, textStatus) 
        {
         if(data)
          {
          fieldName.style.class = 'validFormInput';
       }
           else
          {
          fieldName.style.class = 'invalidFormInput';
       }
        })
 }

I'm no JS/JQuery expert and I didn't test this so it's just to get you started.

Answer 4

I think you need to read a bit about AJAX.

I recommend this link: http://rajshekhar.net/blog/archives/85-Rasmus-30-second-AJAX-Tutorial.html

I think it's simple and easy to understand.

Basically you have server and client side code. JavaScript (client side) can invoke a URL using Ajax(Asynchronous JavaScript And XML) witch is very similar to invoke any other URL using a browser. The main difference is that there is no page reload.

Your JavaScript will need to be waiting for the reply in order to handle it (in your example show or hide an error message).

Basically it allows you to execute some code at the server an update your page without a page refresh.

Answer 5

As Sergio said, you could use this, for example, in a registration form where you have fields like:

Username
E-mail
Password
Repeat Password

You can set up some javascript to validate the form before the user submits it, or better yet, don't enable the submit form until all required fields are complete, avoiding user frustration (you tell him specifically where the error is and how to correct it) and adding another layer of validation to it.

In this case you can pre-validate Username and E-mail against the server to see they are not taken yet. You can do something like this (in jQuery, from memory):

$("#email").change(function(e) {
    var $elem = $(this);
    var val = $elem.val();
    if (!val) {
      myMarkField($elem, "not-valid");
      myValidateForm("myForm");
    } else if (!/^[a-z0-9_+.-]+\@([a-z0-9-]+\.)+[a-z0-9]{2,7}$/i.test(val)) {
      myMarkField($elem, "not-valid");
      myValidateForm("myForm");
    } else {
     $.getJSON("isEmailAvailable.php", {email:val}, function(result){
      if (result.available) {
       myMarkField($elem, "valid");
       myValidateForm("myForm");
      } else {
       myMarkField($elem, "not-valid");
       myValidateForm("myForm");
      }
     });
    }
});

Where isEmailAvailable.php should return something like { available: true }

Answer 6

In short, the AJAX application architecture enables the client (i.e. a piece of JavaScript running in a web browser) to actively ask for information from a server. Most often, the JavaScript client will use the received information to update small portions of the browser's document using the DOM.

Also, the JavaScript client code can do some obvious validation of e.g. a form to be sent to a server (as shown so nicely by Danita's answer).

The server can be anything. It may just return a plain xhtml file, or may respond to the request by calling a complex PHP script that generates a response. Heck, it may even be a dedicated mobile device entirely implemented in bare C. As long as it implements the http protocol the client's request was transmitted in. This might be JavaScript. Improbable but true.

So Yes: it can be done using 'server-side' JavaScript, if you have a server running JavaScript. But No: that's not probable.

And Yes: you apparently need to read upon AJAX. (I'm not a webdesigner, and even I seem to know more than you ;) Don't leave it that way!)

Answer 7

Answer is right here.

http://struts.apache.org/2.x/docs/ajax-validation.html even provides prototype example instead of dojo