4

I am currently validating user input on server side (PHP). The client side sends XMLHttpRequest calls and marks invalid fields with red borders. Everything else is great except that I think it takes too long for the client to make a request and then notice that he filled something wrong. I think I should place some JavaScript validations as well so that the client does not need to wait for the request to finish.

However, I do not want to duplicate validation rules and code. Has anyone implemented validation on both sides so that you do not need to duplicate validation rules at least?

I am using Yii and plain old JavaScript with jQuery if that matters.

Edit: I also find it tedious that the client may have a wrong time on his computer making JavaScript based datetime checks bad. This means I would need to give the right datetime from the server to the script first.

1
  • Nope, not as of yet. But I'm planning to reuse HTML5-style pattern=\w+ regexes client-side for notices and server-side for filtering. Might reduce duplication (given a non-programmatic php form library). Commented Nov 27, 2010 at 16:53

6 Answers 6

2

Create a function i PHP that validates the fields and set it up in a generic way. So you can use it both on the server side as on the client side.

For the clientside use jquery to make some AJAX calls to the PHP validation function.

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

1 Comment

That is what I am doing right now, making an XHR and marking invalid fields with red borders. The problem I see is that longer requests make it look stupid and unusable as the user has to wait for the request to finish.
1

I believe PEARs quick forms allow your to add validation for both client and server side at the same time.

Since you are using the Yii framework and Yii provides a fairly robust validation scheme I'd look at some way of extending the form generation framework to check the fields for a validator, then map each of the validation classes to a js function that you should be able to write quite quickly.

There also appears to be an extension that will do this for you : http://www.yiiframework.com/extension/jformvalidate/

Comments

1

Definitely do not use client side datetime checking for any purposes. You are right on that one.

So you want to write one code for each validation.

So go ahead and code a function in php which does email validation, let's say: validate_email().

Once the user presses submit, you can send all the data to the php code using ajax and have it validated.

Once the user passes the submit phase now you can use the same function validate_email() to validate the $_POST.

This way you write one code, and it is easier to maintain.

Is this slower compared to javascript? Hard to say. Remember, putting an additional jquery validation plugin has its load on the page too. Here is a popular validation plugin for jquery, it is 25KB in its minified version. Now your code is tidy and easier to maintain. If this is a homepage, and assuming you would opt in to use a plug-in, you just saved 25KB load on your probably most valuable landing page.

1 Comment

The jQuery validation plugin mentioned is great. Very easy to use, easy to extend with custom rules.
0

If your validation rules can be described in terms of regular expressions, you can define them in one place and use the same regex in your php code that you use in your generated javascript.

1 Comment

I need more than that though, like making sure dates are within accepted ranges.
0

Some pseudo-code as a possible approach:

In PHP:

function validate() {
    // Use $_POST to validate whatever items in whatever fashion you want
    // and echo a message or some JSON array etc...
}

In javascript (assuming jQuery):

$('#formButton').click(function(event){
    event.preventDefault();
    $.post('/url/of/page', $(this).serializeArray(), function(response){
        // Assuming JSON data, but could just be a string or message,
        // check for response.success or whatever from validation
        if(response.success) $('#form').submit();
        else // Some error message or action
    });
});

This, while perhaps some overhead in AJAX calls, allows you to use any validation method you would want to and keeping the code the exact same whether from an actual POST or via AJAX. A simple response from a $_POST iteration from PHP, though, is not that much overhead. This also allows you to run queries if you need to - of course you'd want to keep them simple since everything would run twice.

2 Comments

Please, see my comment for PeeHaa.
Locally? On the server? A simple PHP request for form validation should be near instantaneous. If you have a sub-par server or are doing a ton of loading overhead before the validation this would pose a problem. How big is your form?
-1

at first i can say never trust user... user can change java script... so server side validation is require

second: why we use client side validation? for speed.

i think you should use both way . cuase you dont want waste user time

validate with js and sent data. in admin if there is wrong data exit user.

1 Comment

That's exactly what the OP is planning to do. The question is how to do it.

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.