PHP - Moved: Ajax - Javascript Validation Form

This topic has been moved to JavaScript Help.

http://www.phpfreaks.com/forums/index.php?topic=352057.0

Let's say I have a form with 5 fields to fill out

Is it better practice to use Javascript to ensure that all fields are non-empty, a certain length, contain certain characters, etc. Or should the back end PHP side of things handle this, then return an error code to be printed out, etc

Thanks!

I'm a major JS noob and this is driving me nuts. I'm trying to use this in a form:   http://reactiveraven...trapValidation/   And using the examples, can't get anything to work. Only my browser's non-js HTML 5 form validation. Anybody have a simple that incorporates both HTML and JS? The examples only show the html.

I am working on a PHP project that will allow a user to upload a handful of images, and then submit text to go along with it.

To simplify the uploading process of a file, I restricted the type of file that can be uploaded (jpg) and the size (2.5mb). The problem is, the form is calling to a PHP script, and I have error logging built in to alert the user of why a file didn't upload, but since the PHP script is just being called, no errors are being displayed on the page. I guess unless I do a refresh of a few seconds to view any errors on the page....

What I would like to do is show a pop-up/error message notifying the user that the file type or size is incorrect and needs to be adjusted. Now part of the problem is, the file needs to be uploaded to the server first, and then everything can be checked, so I am really getting confused.

If someone can point me in the right direction on what I could use to accomplish this, it would be greatly appreciated. Thanks

-beemer

Hi there, I am using the jQuery, Ajax PHP code which is given at http://roshanbh.com.np/2008/04/ajax-login-validation-php-jquery.html

The form I am using, which is in index.html, is:
Code: [Select]
<form method="post" action="" name="login" id="login_form">
                    <div class="field_row">
                        <div class="label_container">
            <label>Email</label>                       
                        </div>
                        <div class="field_container">
            <input type="text" placeholder="login with your email address..." name="email_address" id="email_address" value="" class="large" />                       
                        </div>
        <div class="clear"><span class="nodisp">&nbsp;</span></div>
        </div>

        <div class="field_row">
            <div class="label_container">
            <label>Password</label>         
            </div>
            <div class="field_container">
            <input type="password" placeholder="...and password" name="password" id="password" value="" class="large" />         
            </div>
        <div class="clear"><span class="nodisp">&nbsp;</span></div>
        </div>
               
                    <div class="final_row">
                        <input type="image" src="images/login_blue.gif" id="user_login_button" name="user_login_button" value="login" id="submit" class="submit_button" />
                        <div class="final_row_text_container" >
<a href="/login/forgot_password" style="color: #008ee8;" class="small_text">Forgot your Password?</a>
                        <br />
<span id="msgbox" style="display:none"></span>
</div>
                    </div>
<div class="clear"><span class="nodisp">&nbsp;</span></div>

                </form>

The Javascript, which is situated in the head of index.html. is:
Code: [Select]
<script language="javascript">
$(document).ready(function()
{
$("#login_form").submit(function()
{
//remove all the class add the messagebox classes and start fading
$("#msgbox").removeClass().addClass('messagebox').text('Validating....').fadeIn(1000);
//check the email address exists or not from ajax
$.post("login_ajax.php",{ email_address:$('#email_address').val(),password:$('#password').val(),rand:Math.random() } ,function(data)
        {
  if(data=='yes') //if correct login detail
  {
  $("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
{
  //add message and change the class of the box and start fading
  $(this).html('Logging in.....').addClass('messageboxok').fadeTo(900,1,
              function()
  {
  //redirect to secure page
document.location='secure.php';
  });
 
});
  }
  else
  {
  $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{
  //add message and change the class of the box and start fading
  $(this).html('Your login details are incorrect.').addClass('messageboxerror').fadeTo(900,1);
});
          }

        });
  return false; //not to post the  form physically
});
//now call the ajax also focus move from
$("#password").blur(function()
{
$("#login_form").trigger('submit');
});
});
</script>

And the PHP, in login_ajax.php, is:

<?php session_start();

$host =  "localhost";
$user = "bford";
$pass = "bford";
$db = "bford";

$link = mysql_connect($host, $user, $pass);
if (!link) 
{
die('<strong>Error(s) occured:</strong> Could not connect: ' . mysql_error());
}

$db_selected = mysql_select_db($db, $link);
if (!db_selected) 
{
die ('<strong>Error(s) occured:</strong> Cant use bford: ' . mysql_error());
}

//get the posted values
$email_address=$_GET['emailaddress'];
$pass=$_GET['password'];

//now validating the username and password
$sql="SELECT * FROM users WHERE email_address='".$email_address."'";
$result=mysql_query($sql);
$row=mysql_fetch_array($result);

//if username exists
if(mysql_num_rows($result)>0)
{
//compare the password
if($row["password"],$pass)==1
{
echo "yes";
//now set the session from here if needed
$_SESSION["user_name"]=$userID; 
}
else
echo "no"; 
}
else
echo "no"; //Invalid Login


?>


I have been working on this for days now, changing around the form names, database table names, php variables, allsorts! I still cannot get it functioning properly. When I input a correct email_address and password combination, the 'Your login details are incorrect.' message still appears.

Help would be much appreciated.

Ben.