PHP form client side validation

Question

Possible Duplicate:
How to determine if user selected a file for file upload?

I would like a simple PHP form validation. My form has two inputs: A link and a file to upload. The form should be submitted only if the link field is filled and the user selected a file to upload. If one of them is or both are false, an alert box should be displayed (like here when you click Upload without selecting a file).

This is my form:

<form action="upload_file.php" enctype="multipart/form-data" method="post">

<p>Link:<br>
<input type="text" name="link" size="50">
</p>
<p>Image:<br>
<input type="hidden" name="MAX_FILE_SIZE" value="2000000">
<input type="file" name="file" id="file" size="40">
</p>
<div>
<input type="submit" name="upload" value="Upload"> 
</div>

</form>

I am new to PHP and I have been browsing tutorials for hours now, many of them was of no help or shows the server side validation.

I understand I should start with this:

<form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">

to validate the fields before the form is submitted. I have some basic knowledge of PHP but I cannot figure out how to do this easy or not so easy task.

PHP, being *server-side* validation, can not validate the form fields *before* they are submitted to the server for processing. — Charles, Dec 28 '12 at 10:22
This has less to do with PHP but more with Javascript - at least for the client-side-validation. Consult the Javascript reference of your choice and check the properties and methods those HTML elements in question offer. — hakre, Dec 28 '12 at 10:22
Sorry, you are right about that. I managed to do it with JavaScript, I just have some worries since I read on many pages that it's not working if the user disabled JavaScript in the browser. — erdomester, Dec 28 '12 at 10:29
@erdomester: you say "I understand I should start with this:" no you don't... you have to study more... — Luca Filosofi, Dec 28 '12 at 10:29
Word of warning: If all your validation is in javascript, then you don't have validation. I can turn javascript off in my browser, or use CURL to craft a HTTP POST request and bypass any javascript validation entirely. — GordonM, Dec 28 '12 at 11:17

score 1 · Accepted Answer · answered Dec 28 '12 at 10:25

php is server side. What you need is a client side checker (js, jq ..)

You can perform the check only with php, but on your server, then return to the client the error message or the task complete message. If you want the check to be done client side, you need a client side language to handle it.

score 1 · Answer 2 · answered Dec 28 '12 at 10:29

PHP is indeed a server-side application and thus cannot perform client-side validation.

If you really want to do client-side validation, you'll probably have to use javascript. Have a look at the jQuery validation plugin. Here is a big demo page showing you some of the possibilities: http://jquery.bassistance.de/validate/demo/

For more help and information, also have a look at the jQuery.com/plugins/validation page.
(Note the WARNING at the end of this post)

Example:
(the javascript)

<script>
  $(document).ready(function(){
    $("#commentForm").validate();
  });
</script>

(the form)

<form class="cmxform" id="commentForm" method="get" action="">
 <fieldset>
   <legend>A simple comment form with submit validation and default messages</legend>
   <p>
     <label for="cname">Name</label>
     <em>*</em><input id="cname" name="name" size="25" class="required" minlength="2" />
   </p>
   <p>
     <label for="cemail">E-Mail</label>
     <em>*</em><input id="cemail" name="email" size="25"  class="required email" />
   </p>
   <p>
     <label for="curl">URL</label>
     <em>  </em><input id="curl" name="url" size="25"  class="url" value="" />
   </p>
   <p>
     <label for="ccomment">Your comment</label>
     <em>*</em><textarea id="ccomment" name="comment" cols="22"  class="required"></textarea>
   </p>
   <p>
     <input class="submit" type="submit" value="Submit"/>
   </p>
 </fieldset>
 </form>

WARNING
Please keep in mind that javascript, being client-side, runs on the client's computer. Don't rely on javascript validation alone. Anyone can disable javascript and insert 'wrong' values in your form.

score 1 · Answer 3 · answered Dec 28 '12 at 10:33

1

In case of form it's best to do client side validation using some javascript library like jQuery. Check out this jQuery tool for form validation.

For server side validation, check out this link. It may help you.

answered Dec 28 '12 at 10:33

Subrata

2,216
3
24
38

score 0 · Answer 4 · answered Dec 28 '12 at 10:55

0

Validation should be done on server side ALWAYS. You can add client minor validation also as a confort for the user with javascript.

Here some basic code to show a message if fields empty using minor validation:

<input type="submit" name="upload" value="Upload" onclick="var ref = document.getElementById('file'); if ( ref.length == 0 ){ alert( 'select file' ); return false; } ref = document.getElementById( 'textfieldid' ); if ( ref.value.length == 0 ){ alert( 'fill link, better use a regexp to match a url but this another store' ); return false; }">

answered Dec 28 '12 at 10:55

cavila

7,834
5
21
19

Ever heard of functions in JavaScript? Who writes code like that nowadays? – Ja͢ck Dec 28 '12 at 12:28
Of course, this only a very simple example with a way that could be read with no much javascript background. And it does not assume use of anything like jQuery. It is old way but still should work. Anyway why would make a function since would never call it twice? – cavila Dec 28 '12 at 15:47

score 0 · Answer 5 · answered Dec 28 '12 at 11:06

0

For client side validation of "File upload" field, refer following plug-in : http://adamsanderson.github.com/jQuery-File-Validator/

It is useful. I have tried it.

answered Dec 28 '12 at 11:06

Sujit Singh

921
1
10
20

You can configure this to validate according to both - file type and size also. – Sujit Singh Dec 28 '12 at 11:08

PHP form client side validation

5 Answers5