I have a website that allows multiple files to be uploaded using HTML5 multiple setting. I use a PHP script to validate the files and upload them. Using only PHP and HTML/CSS I would like to create a progress bar for the file (or files) being uploaded. How can I achieve this? I know PHP can use APC to get file upload info, but how can that be incorporated for multiple files being uploaded?
<html>
<head>
<style type="text/css" media="screen">
div#banner_left {
position: absolute;
top: 0%;
left: 0%;
width: auto;
}
div#banner_right {
float: right;
width: auto;
}
</style>
<link rel="stylesheet" type="text/css" href="/css/structure.css">
</head>
<?php
echo "<div id='banner_right'>Welcome ";
echo $_SESSION['myusername'];
echo "<br><form action='/logout.php'>";
echo " <input type='submit' value='Logout' style='width:216px; font-size: 15px;'>";
echo "</form>";
echo "</div><br><br>";
?>
<!-- FILE UPLOAD SCRIPT//-->
<?php
if(isset($_POST['submit']))
{
$subject_list = $_POST['subject_list'];
$document_type = $_POST['document_type'];
$uploaddir = "/var/www/rye-high-website/Rye High/uploads/$subject_list/$document_type";
$files=array();
$fdata=$_FILES['rye_file'];
if(is_array($fdata['name'])){
for($i=0;$i<count($fdata['name']);++$i){
$files[]=array(
'name' => $fdata['name'][$i],
'tmp_name' => $fdata['tmp_name'][$i],
);
}
}
else $files[]=$fdata;
foreach ($files as $file) {
// uploaded location of file is $file['tmp_name']
// original filename of file is $file['name']
$move_file = move_uploaded_file($file['tmp_name'], "$uploaddir/".$file['name']);
}
if ($subject_list == "None") {
echo '<br><div class="alert">Please Pick A Course Code</div>';
}
if ($document_type == "None"){
echo '<br><div class="alert">Please Pick A Document Type</div>';
}
if($move_file){
echo '<br><div class="info">File is valid, and was successfully uploaded to: $subject_list folder</div>';
}
else {
echo '<br><div class="alert">Upload Failed</div>';
echo $move_file;
}
}
?>
<!-- CONTINUE WITH HTTP FORM//-->
<body>
<div id="banner_left">
<img src="/Rye High/images & scripts/logo_ryerson.gif"/>
</div>
<br><br><div class="img">
<img src="/images/logo.png" />
</div><center>
<form enctype="multipart/form-data" action="<?php echo htmlentities($_SERVER['REQUEST_URI']); ?>" method="POST">
Choose Document Type:
<select name="document_type">
<option value="None">Pick Document Type</option>
<option value="Textbooks">Text Books</option>
<option value="Notes & Assignments">Assignment/Notes</option>
</select><br>
Choose Course Code:
<select name="subject_list">
<option value="None">Pick Course</option>
<option value="ACC 100">ACC 100</option>
<option value="ACC 406">ACC 406</option>
</select><br>
Choose file(s) to upload (Max 500MB): <input name="rye_file[]" type="file" id="multiple" multiple />
<input type="submit" name="submit" value="Upload" />
</form>
I appreciate your help,
P.S. I would prefer to avoid using javascript since I'm not familiar with it well enough. PHP and HTML/HTML5 preferred.
You save yourself a lot of struggle if you use javascript to solve the issue! Under is a link to a tutorial, maybe take the best from that one, and search for it on google.
http://www.w3bees.com/2013/10/file-upload-with-progress-bar.html
http://hayageek.com/jquery-multiple-file-upload/
Related
I need help solving this issue. I have stored my pictures as blob in mysql database and when i try to run this code to retrieve data from the database, the pictures are displayed as punch of characters but the rest of data types are working fine. I think the browser does not know that the data is a picture. How can I convert the blob into pictures in this code.
<?php
include_once('db.php');
if(isset($_POST['personID'], $_POST['fName'], $_POST['lName'], $_POST['title'], $_POST['pic']))
{
$personID= $_POST['personID'];
$fName= $_POST['fName'];
$lName= $_POST['lName'];
$title= $_POST['title'];
$pic= $_POST['pic'];
if(mysql_query("INSERT INTO samidb.persons VALUES ('$personID','$fName', '$lName', '$title', '$pic')"))
echo "Successful Insertion!";
else
echo "Please try again";
}
$res = mysql_query("SELECT * FROM samidb.persons");
?>
<html>
<head>
<style type="text/css">
li { list-style-type: none; display: inline-block; padding: 10px; text-align: center;}
//li:hover { background-color: yellow; }
</style>
</head>
<body>
<form action="." method="POST">
person ID: <input type="text" name="personID"/><br />
First Name: <input type="text" name="fName"/><br />
Last Name: <input type="text" name="lName"/><br />
title: <input type="text" name="title"/><br />
pic: <input type="image" name="pic"/><br />
<input type="submit" value=" Enter "/>
</form>
<h1>List from database ..</h1>
<ul>
<?php
while( $row = mysql_fetch_array($res) )
echo "<li>$row[personID]. <li>$row[fName] <li>$row[pic]</li>
<li><a href='edit.php?edit=$row[personID]'>edit</a></li>
<li><a href='delete.php?del=$row[personID]'>delete</a></li><br />";
?>
</ul>
</body>
</html>
Most people just store the path to the image. It's easy, it puts the saving of the data in the file system, built for that sort of thing, it cuts down on the db size, etc.
However, you should be able to use it as an inline image, usually base 64 encoded, as mentioned here:
Embedding Base64 Images
FYI, I tested this out using this code:
<img src="data:image/png;base64,<?php echo base64_encode (file_get_contents('./screenshot.png')); ?>" />
You could probably do something like:
<img src="data:image/png;base64,<?php echo base64_encode ($row['pic']); ?>" />
I have some forms in php that upload data into a mysql database. I have already tested on a localhost server with xampp, but when I upload my files into my host ftp, the forms do not work. I think it has something to do with the fact that I put this file and also the "connect.php" file under password restriction, and that has something to do with the file permissions. I've already granted permission to the user of the database and permission to the file and I also had tried without the password protection, but the result is the same.
So I start to experiment a little and I figured out that the image uploads fine into the database but the other inputs don't, neither the "header" input nor the "article" textarea... knowing that, I tried to "echo out" these input results but none of them show something unless the image input. I came to the conclusion that my form is sending empty data. Can someone make suggestions as to what is happening and how to fix it? Here's my code:
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>
<body>
<div id="slider_upload">
<h1>Slider principal</h1>
<div class="forma">
<form action="sliderPrincipal.php" method="post" enctype="multipart/form-data">
<p><label for="header">Header</label>
<input type="text" id="header" name="header" /></p><br>
<input type="hidden" name="MAX_FILE_SIZE" value="1048576" />
<p><label for="fileupload">File to upload</label>
<input type="file" id="fileupload" name="fileupload" /></p><br>
<p><label for="article">article</label>
<textarea id="article" name="article" rows="26" style="width: 100%;" >Write here</textarea></p><br>
<button type="submit" name="submit" value"send">Upload File</button>
</form><br><br>
</div>
</div>
<div class="message">
<?php
$file_dir = "../uploaded";
if (isset($_POST['header'])){
$header = mysql_real_escape_string($_POST['header']);
$article = mysql_real_escape_string($_POST['article']);
}
foreach($_FILES as $file_name => $file_array){
//echo "path: ".$file_array['tmp_name']."<br />\n";
//echo "name: ".$file_array['name']."<br/>\n";
//echo "type: ".$file_array['type']."<br/>\n";
//echo "size: ".$file_array['size']."<br/><br/>\n";
//echo "encabezado ".$encabezado;
if(is_uploaded_file($file_array['tmp_name'])){
move_uploaded_file($file_array['tmp_name'], "$file_dir/".$file_array['name']) or die ("Your image couldnt be uploaded <br>");
$newpath = addslashes("uploaded/".$file_array['name']);
include "connect.php";
$addfile = "INSERT INTO slider (header, image, article) VALUES ('$header','$newpath', '$article')";
$result = mysql_query($addfile);
if ( $result === FALSE ) {
echo "your post could not be uploaded but we already got your image in our files ";
} else{
echo '<p style="padding: 20px;"><h1>Your post was successfully uploaded <h2></p><br><br>';
}
mysql_close();
} else "No file found";
}
?>
</div>
</div>
</body>
</html>
i have the following dropdown box:
page index.php
<script type="text/javascript">
$(document).ready(function() {
$('#loader').hide();
$('#show_heading').hide();
$('#search_category_id').change(function(){
$('#show_sub_categories');
$('#loader').show();
$.post("get_chid_categories.php", {
kwdikos: $('#search_category_id').val(),
}, function(response){
setTimeout("finishAjax('show_sub_categories', '"+escape(response)+"')", 400);
});
});
});
function finishAjax(mhnas_exodwn, response){
$('#loader').hide();
$('#show_heading').show();
$('#'+mhnas_exodwn).html(unescape(response));
$('#'+mhnas_exodwn).fadeIn();
}
function alert_id()
{
if($('#sub_category_id').val() == '')
alert('Please select a sub category.');
else
alert($('#sub_category_id').val());
return false;
}
</script>
<style>
.both h4{ font-family:Arial, Helvetica, sans-serif; margin:0px; font-size:14px;}
#search_category_id{ padding:3px; width:200px;}
#sub_category_id{ padding:3px; width:100px;}
.both{ float:left; margin:0 15px 0 0; padding:0px;}
</style>
</head>
<?php
include('dbcon.php');?>
<body>
<div style="padding-left:30px;">
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" name="form" method="post" enctype="multipart/form-data">
<div class="both">
<select name="search_category" id="search_category_id">
<option value="" selected="selected">Πολυκατοικία</option>
<?php
$query = "SELECT DISTINCT polykatoikia,kwdikos FROM exoda ORDER BY polykatoikia ASC";
$results = mysql_query($query);
while ($rows = mysql_fetch_assoc(#$results))
{
echo "<option ". (($_REQUEST['search_category'] == $rows["kwdikos"]) ? 'selected ' : '') ."value=\"".$rows["kwdikos"]."\">".$rows["polykatoikia"]."</option>";?>
<!-- <option value="<?php echo $rows['kwdikos'];?>"><?php echo $rows['polykatoikia'];?></option>-->
<?php
}?>
</select>
</div>
<div class="both">
<div id="show_sub_categories" align="center">
<img src="loader.gif" style="margin-top:8px; float:left" id="loader" alt="" />
</div>
</div>
<? echo "<p><input type = 'hidden' value=$rows[mhnas_exodwn] name='mhnas'</p>"; ?>
<input type="submit" class="button small gray" name="" value="sumbit" />
</form>
</div>
here's the get_chid_categories.php:
<?php
include('dbcon.php');
if($_REQUEST)
{
$id = $_REQUEST['kwdikos'];
$query = "select distinct kwdikos,mhnas_exodwn from 010_08_exoda where kwdikos= ".$id;
$results = mysql_query( $query);?>
<select name="sub_category" id="sub_category_id">
<option value="" selected="selected">Μήνας</option>
<?php
while ($rows = mysql_fetch_assoc(#$results))
{
<option value="<?php echo $rows['mhnas_exodwn'];?>"><?php echo $rows['mhnas_exodwn'];?></option>
<?php
}?>
</select>
<?php
}
?>
as you can see i can keep selected the first combobox value after submit, how i can keep the second dropdown value shown?
After i submit, the second dropdown disappears.
thanks
You have two options:
1) After the user submitted the form - using the server side you will need to analyze the content of the POST header - or if your form use GET, you will need to parse the querystring (that's something that you can also do using javascript)
2) You validate your form without the 'submit' action but by using an Ajax call. This Ajax call can return you an error code based on the error made by the user and then you can update the user interface accordingly.
I recommend the second option. You have a good example here
I need to create a page having two, frame like structure. On left I always want to show a small form with around 10 entries which after clicking the submit button perform some processing and shows result. I need to have access to the left part at all times. The right part is for processing data, accessing database and display results.
Earlier I created a page with frames but has some issues with chrome and the fact that fame is depricated, I want to swich to some other structure.
I am comfortable with php and html. Someone suggested me ajax but I am zero in that.
How can I accomplish frame like structure having two parts that load different files?
Thanks
The reason I dont want to use frame is given below:
I have a testframe.php file that loads testinpform.php into right
frame containing code to create 3 buttons. when I load the
testframe.php, It shows all the the buttons in the right frame and all
the buttons work as desired for the first time. once a button is
clicked, none of the buttons work after that click. When I move to
some other page using some other link and come back, then these
buttons start working again.
This beavior is shown only by Chrome browser.
If I do not use frame and just load testinpform.php, all the buttons
work as desired.
In firefox, the same code work pefectly fine with or without frame.
So, Is this a problem of chrome or I need to add something in my code
to make it work in all browsers.
My code is as follows.
testframe.php
<?php
function generateFrames() {
echo "<FRAMESET COLS=\"360,*\">\n";
echo "<FRAME noresize NAME=\"input\" SRC=\"otherfile.php?page=left\">\n";
echo "<FRAME NAME=\"output\" SRC=\"testinpform.php?page=right\">\n";
echo "</FRAMESET>";
}
if($page=="left") {
echo "<BODY BGCOLOR=\"#FFFFFF\">";
echo "<FONT FACE=\"Arial,Verdana,Helvetica\" COLOR=\"FF0000\" SIZE=\"3\">PHP Tester</FONT>";
echo "<FORM METHOD=\"get\" ACTION=\"processForm.php?page=right\"TARGET=\"output\">\n";
echo "<TABLE BORDER=\"0\" CELLSPACING=\"0\" CELLPADDING=\"0\">\n";
echo "<TR><TD><TEXTAREA NAME=\"input\" COLS=\"100\" ROWS=\"40\"
WRAP=\"virtual\">".$input."</TXTAREA></TD></TR>\n";
echo "<TR><TD ALIGN=\"center\"><INPUT TYPE=\"submit\"
VALUE=\"Execute\"></TD></TR></TABLE></FORM>\n";
echo "</BODY>";
}
else if ($page=="right") {
echo "<BODY BGCOLOR=\"#FFFFFF\">";
if(empty($input)) {
echo "Ready to parse...";
}
else {
$input=stripSlashes($input);
eval($input);
}
echo "</BODY>";
}
else {
generateFrames();
}
?>
testinpform.php
<?php
$filenames = array("file1.txt", "file2.txt", "file3.txt");
$namesToshow = array("file1", "file2", "file3");
$numfiles = count($filenames);
for ($i = 0; $i< $numfiles; $i++)
{
echo"<form enctype=multipart/form-data method=GET
action='viewResult.php' target='_blank' >";
echo"<input type='hidden' name='filetoview' value= $filenames[$i] >";
echo"<input type='submit' value= $namesToshow[$i] >";
echo'</FORM>';
}
echo"<a href= abc.com>click here to go to next page and then come back using the back button>";
?>
Thanks
#Silvertiger
Thanks for your reply.
I am looking at your code and try to customize it according to my need.
I am giving the simplest example for my case.
frame.php contains the code suggested by #silvertiger.
In the left part, I want to include "inputform.php" that has (for example) following code:
<form name="secondForm" method="POST" enctype="multipart/form-data" action = 'process.php' target = "output">
<input type="hidden" name="organism" value="human" >
Enter the input in the text box:<br />
<textarea name="textArea" cols="40" rows="6" >Enter your query here</textarea> <br />
<input type="submit" value="submit" class="html-text-box">
</form>
When I call frame.php and press the submit button, the input form pass all the data to process.php which will show its result on the right half.
process.php file is:
<?php
$organism= $_POST['organism'];
$textArea = $_POST['textArea'];
print ("\n$organism, $textArea");
?>
What changes do I need in the frame.php file below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Some Page</title>
<script type="text/javascript" src="includes/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
function loadform1() {
jQuery.ajax({ // create an AJAX call...
data: jQuery('#myform1').serialize(), // get the form data
type: 'POST', // GET or POST
url: 'process.php', // the file to call
success: function(response) { // on success..
$('#displaydata').html(response); // update the DIV
}
// might need to add a return false here so the page won't reload
});
};
</script>
</head>
<body>
<div style="float:left;width:50%;">
<form id="myform1" name="myform1" onsubmit="loadform1()">
<div style="float:left; width: 150px;">Criteria 1</div>
<div style="float:left; margni-right: 20px;">
<input type="text" name="criteria1" value="" />
</div>
<div style="clear:both; height: 30px;"></div>
<div style="float:left; width: 150px;">Criteria 2</div>
<div style="float:left; margni-right: 20px;">
<input type="text" name="criteria2" value="" />
</div>
<div style="clear:both; height: 30px;"></div>
<input type="submit" value="Show Form 1 results" />
</form>
<div style="clear:both; height: 30px;"><hr></div>
</div>
<div id="displaydata" style="float:left;width:50%; text-indent: 30px;">
<?php include('defaultpage.php'); ?>
</div>
</body>
</html>
Thanks a lot.
Use framesets:
<frameset cols="25%,*,25%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />
<frame src="frame_c.htm" />
</frameset>
A way to do it without frames using JQuery. You would have to get a copy, the jquery version I use here is a bit old, but the sample is still valid and it is not as intimidating as you might think. A static form on the left that has the variables you wish to submit/track, and then a JQuery call (just javascript) i call the loading of the other page within a div. all dynamic, no page reload required etc.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Some Page</title>
<script type="text/javascript" src="includes/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
function loadform1() {
jQuery.ajax({ // create an AJAX call...
data: jQuery('#myform1').serialize(), // get the form data
type: 'POST', // GET or POST
url: 'form1resultpage.php', // the file to call
success: function(response) { // on success..
$('#displaydata').html(response); // update the DIV
}
// might need to add a return false here so the page won't reload
});
};
function loadform2() {
jQuery.ajax({ // create an AJAX call...
data: jQuery('#myform2').serialize(), // get the form data
type: 'POST', // GET or POST
url: 'form2resultpage.php', // the file to call
success: function(response) { // on success..
$('#displaydata').html(response); // update the DIV
}
// might need to add a return false here so the page won't reload
});
};
</script>
</head>
<body>
<div style="float:left;width:50%;">
<form id="myform1" name="myform1" onsubmit="loadform1()">
<div style="float:left; width: 150px;">Criteria 1</div>
<div style="float:left; margni-right: 20px;">
<input type="text" name="criteria1" value="" />
</div>
<div style="clear:both; height: 30px;"></div>
<div style="float:left; width: 150px;">Criteria 2</div>
<div style="float:left; margni-right: 20px;">
<input type="text" name="criteria2" value="" />
</div>
<div style="clear:both; height: 30px;"></div>
<input type="submit" value="Show Form 1 results" />
</form>
<div style="clear:both; height: 30px;"><hr></div>
<form id="myform2" name="myform2" onsubmit="loadform2()">
<div style="float:left; width: 150px;">Criteria 1</div>
<div style="float:left; margni-right: 20px;">
<input type="text" name="criteria1" value="" />
</div>
<div style="clear:both; height: 30px;"></div>
<div style="float:left; width: 150px;">Criteria 2</div>
<div style="float:left; margni-right: 20px;">
<input type="text" name="criteria2" value="" />
</div>
<div style="clear:both; height: 30px;"></div>
<input type="submit" value="Show form 2 results" />
</form>
</div>
<div id="displaydata" style="float:left;width:50%; text-indent: 30px;">
This is the display page, it will change
</div>
</body>
</html>
then it's just a matter of creating a form per "function" you with to display, and then copy/pasting and modifying the jquery call to submit the other form to another page... I will edit the example to have 2 forms :). If you just need 1 form that performs functions with 10 or 12 fields, remove the "myform2" stuff and you're good to go!!!
See below
myFile.html
<frameset cols="25%,*">
<frame src="myFileA.html" />
<frame src="myFileB.html" name="main"/>
</frameset>
myFileA.html
<html>
<body>
File A<br>
File B<br>
File C
</body>
</html>
myFileB.html
<html>
<body>
Default Page
</body>
</html>
Also create a.html, b.html and c.html.
Open myFile.html in browser and see the MAGIC...
Let me know if something else is needed!!!
Good Luck!!! Cheers!!!
I'm trying to write a form for User Information to keep track of who downloads files from my website.
I downloaded a PHP form validator from this website and I tried to mimic the example 3 with client-side validation and here is what I came up with (please excuse the length, but I figured it was necessary for understanding everything):
<?php
require_once(ABSPATH. '/wp-includes/FormValidator/include/formvalidator.php');
$validation_errors='';
if(isset($_POST['submitButton']))
{// We need to validate only after the form is submitted
//Setup Server side Validations
//Please note that the element name is case sensitive
$validator = new FormValidator();
$validator->addValidation("firstname","req","Please fill in your First Name");
$validator->addValidation("firstname","alpha","Only letters a-z/A-Z are allowed for your First Name");
$validator->addValidation("lasttname","req","Please fill in your Last Name");
$validator->addValidation("lastname","alpha","Only letters a-z/A-Z are allowed for your Last Name");
//Then validate the form
if($validator->ValidateForm())
{
//If the validations succeeded, proceed with form processing
addUserDataToDB();
}
else
{
//Validations failed. Display Errors.
$error_hash = $validator->GetErrors();
foreach($error_hash as $inpname => $inp_err)
{
$validation_errors .= "<p>$inpname : $inp_err</p>\n";
}
}
}//if
$first_name = isset($_POST['firstname'])?$_POST['firstname']:'';
$last_name = isset($_POST['lastname'])?$_POST['lastname']:'';
?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
<title>Whitepaper Download User Info</title>
<style type="text/css">
.error
{
font-family: Verdana, Arial, sans-serif;
font-size: 0.7em;
color: #900;
background-color : #ffff00;
}
</style>
<script type='text/javascript' src='<?php echo ABSPATH.'/wp-includes/FormValidator/scripts/gen_validatorv31.js' ?>'>
</script>
</head>
<body>
<form id="DownloadUserDataForm" style="width:100%;">
<fieldset>
<div style="width:100%;">
<p><b>Input Fields with (*) are Required.</b> <br/><p>
<div>
<span class='error'><?php echo $validation_errors; ?></span>
</div>
<div style="width:100%;">
<div style="display:inline-block; float:left; width:48%; margin-right:5px;">
<b>First Name *:</b> <input type="text" name="firstname" style="width:82%;" maxlength="50" <?php if (isset($errors)) { echo 'value="'.htmlentities($_POST['first_name']).'"'; }?>
/> <br />
<span id='firstname_errorloc' class='error'></span>
</div>
<div style="display:inline-block; float:left; width:48%;">
<b>Last Name *:</b> <input type="text" name="lastname" maxlength="50" style="display:inline-block; width:82%;" <?php if (isset($errors)) { echo 'value="'.htmlentities($_POST['last_name']).'"'; } ?> /><br/>
<span id='lastname_errorloc' class='error'></span>
</div>
</div>
<br />
<div class="clear:both;">
<p><input type="submit" name="submitButton" value="Submit" style="clear:both;" /></p>
</div>
</div>
</fieldset>
</form>
</body>
</html>
<?php
//Function for Processing Data
function addUserDataToDB()
{
global $wpdb;
$firstname = $_POST['firstname'];
$lastname = $_POST['lastname'];
$rows_affected = $wpdb->insert( 'wp_downloadUserData', array( 'time' => current_time('mysql'), 'firstname' => $firstname,
'lastname' => $lastname ) );
//Redirect to download page
wp_redirect('Whitepaper.htm');
exit();
}
?>
<!-- client-side Form Validations:
Uses the form validation script from JavaScript-coder.com
See: http://www.javascript-coder.com/html-form/javascript-form-validation.phtml
-->
<script type='text/javascript'>
console.log("javascript ran");
var frmvalidator = new Validator("DownloadUserDataForm");
frmvalidator.EnableOnPageErrorDisplay();
frmvalidator.EnableMsgsTogether();
frmvalidator.addValidation("firstname","req","Please fill in your First Name");
frmvalidator.addValidation("firstname","alpha","Only letters a-z/A-Z are allowed for your First Name");
frmvalidator.addValidation("lasttname","req","Please fill in your Last Name");
frmvalidator.addValidation("lastname","alpha","Only letters a-z/A-Z are allowed for your Last Name");
</script>
All that happens is the page refreshes, no errors or validations, and it doesn't seem to write to $wpdb because I have an admin page that queries the db table and it comes up empty (it also doesn't wp_redirect() like it should). Also for some reason it cannot find the javascript file even though the address looks correct.
GET
http:///home/public_html/wp-includes/FormValidator/scripts/gen_validatorv31.js
404 (Not Found)
For your javascript error try changing this line:
<script type='text/javascript' src='<?php echo ABSPATH.'/wp-includes/FormValidator/scripts/gen_validatorv31.js' ?>'>
to
<script type="text/javascript" src="<?php echo ABSPATH; ?>/wp-includes/FormValidator/scripts/gen_validatorv31.js"></script>