Hi I want to validate the field values before submit the form here is my code
<table width="600" border="0" align="left">
<tr>
<script type="text/javascript">
function previewPrint()
{
var RegNumber = document.getElementById('PP_RegNoTextBox').value;
var PassportNo = document.getElementById('PP_PassportNoTextBox').value;
if (RegNumber=="")
{
alert("Please enter your Reg No.!");
document.getElementById('RegNoTextBox').focus();
return false;
}
if (PassportNo=="")
{
alert("Please enter your Passport No.!");
document.getElementById('PassportNoTextBox').focus();
return false;
}
//window.open('regformview.php?RegNumber=RegNumber');
}
</script>
<form name="ppform" onSubmit="return previewPrint();" method="post" action="regformview.php">
<td width="100" align="LEFT" class="font8"> </td>
<td width="337" align="LEFT" class="font8"><u>Preview your Application:</u> Please provide requested details.<br>
Reg No.: <input type="text" name="printregno" id="PP_RegNoTextBox" class="input2"> Passport No.: <input type="text" name="printemail" class="input2"><input type="hidden" name="flagging" id="PP_PassportNoTextBox" value="1" class="input2"> </td>
<td width="50" align="LEFT" class="font8"><div style="float:left; background-image:url(images/printPreview1.jpg); background-repeat:no-repeat;">
<input type="image" src="images/printPreview1.jpg" name="ppbutton" value="" onMouseOver="this.src='images/printPreview2.jpg'" onMouseOut="this.src='images/printPreview1.jpg'"></div></td>
</form>
</tr>
</table>
Problem is its showing the alert box correctly if it blank but the page is navigating to regformview.php after submitting. How to navigate to regformview.php only after validation.?
These are undefined:
document.getElementById('RegNoTextBox').focus();
document.getElementById('PassportNoTextBox').focus();
it should be:
document.getElementById('PP_RegNoTextBox').focus();
document.getElementById('PP_PassportNoTextBox').focus();
Everything is fine, except you have error in your script with let you submit even if validation fails.
change the following lines
document.getElementById('PassportNoTextBox').focus();
and
document.getElementById('RegNoTextBox').focus();
as
document.getElementById('PP_PassportNoTextBox').focus();
and
document.getElementById('PP_RegNoTextBox').focus();
Try this it should work.
onSubmit="previewPrint();return false;"
Related
The form that I'm trying to work has two buttons:
1: for viewing the submitted information and
2: for saving the confirmed information.
Part of my form:
$sql="INSERT INTO applicant_information
(entrepreneur_name,enterprise_name,.....) values
('".$_POST['entrepreneur_name']."','".$_POST['enterprise_name']."','".$_POST['address']."'...)
<form method="post" action="business_form.php">
<table width="70%" cellspacing="2px" cellpadding="5px"style="border:1px solid black;border-collapse:collapse;">
<th colspan="8"align="left" style="border:1px solid black;"><b>Personal
Information</th>
<tr>
<td width="18" rowspan="2" style="border:1px solid black;">1</td>
<td width="142" rowspan="2"style="border:1px solid black;" >Name</td>
<td style="border:1px solid black;" colspan="2">Entrepreneur</td>
<td colspan="2"style="border:1px solid black;"><?php echo $_POST['entrepreneur_name']?>
<input id="entrepreneur_name" name="entrepreneur_name" type="hidden" value="<?php echo $_POST['entrepreneur_name']?>" />
</td>
</tr>.....
//rest of the form
<input type="submit" name="edit" style="width:10%"value="Back to edit" />
<input type="submit" name="reg"style="width:10%"value="Submit" />
What I'm trying to do is to run the query when the user hit the submit button. Any idea how to do that?
What I usually do is just have one button change the form's destination on click, then submit it. So for example:
<form action="login.php" method="POST" id="myform">
<input name="username">
<input type="password" name="password">
<input type="submit" value="Login">
<button id="js-register">Register</button>
</form>
With
$('#js-register').click(function() {
$('#myform').attr('action', 'register.php').submit();
});
Or you could have both buttons be Javascript'd and bind both of them for consistency's sake - up to you.
HTML
<form action="handle_user.php" method="POST />
<input type="submit" value="View" name="view" />
<input type="submit" value="Submit" name="submit">
</form>
Check condition in php as following way...
if($_POST["view"]) {
//User hit the view button, handle accordingly
}
if($_POST["submit"]) {
//User hit the Submit information , handle accordingly
}
You need to track the button named "reg". So right after the $sql string, you can put the following:
<?php
if (isset($_POST['reg'])) {
mysql_query($sql);
if (mysql_affected_rows() > 0) {
echo "REgistration completed";
}
else {
echo "System could not process the registration";
}
}
?>
Hope that will help you.
You could make the "edit" be a plain button, instead of a submit type. And bind a click event to it, which could either redirect to the editable form or make the form editable (which ever suits you best). Then the "reg" submit could work as it does currently to save the data.
I have a form, which I'm using autofill using jquery in the first textfield. This textfield is called "producto1".
What I want is that when user write the information in "producto1" automatically load the content in "marca1", the content in this field will be loaded from my database.
This is my code:
<table width="100%" border="0" align="center" cellpadding="5" cellspacing="0">
<tr>
<td width="545"><div align="center">
<input name="producto1" type="text" class="textfield4" id="producto1" value="" size="65" />
</div></td>
<td width="385"><div align="center">
<input name="marca1" type="text" class="textfield5" id="marca1" size="10" maxlength="5" onKeyPress="return handleEnter(event);">
</div></td>
<td width="385"><input name="cantidad1" type="text" class="textfield5" id="textfield2" size="10" maxlength="5" onKeyPress="return handleEnter(event);"></td>
</tr>
</table>
The information that will be displayed at the "marca1" field will be loaded from my database, but my problem is that I don't know how to populate automatically this second field using ajax.
// JS File
$(document).ready(function(){
$("#producto1").keyup(function(){
$.post('/path-to/marca.php',
{
text: $(this).val()
},
function(data) {
$('#marca1').val(data.returns);
},
'json');
});
});
// PHP File
$sql = $mysqli->query("SELECT marca_name
FROM marca
WHERE marca_name
LIKE '%" . $mysql->real_escape_string($_POST['text']) . "%'");
while($row = $sql->fetch_assoc($sql))
$returns[] = $row['marca_name'];
echo json_encode("returns" => implode(",", $returns));
So Im relatively new to PHP from ASP. And After converting alot of ASP code into PHP I have come across a problem where my PHP code seems unable to find the hidden variable I have set. It worked fine in ASP and was just wondering the best way to resolve this.
Start of the Form:
<form name="LogIn" action="login.php" method="post">
<td bgColor=#ffffff>
<table align="center" cellSpacing="2" cellPadding="2" border="0">
<tr>
<td> </td>
<td align="right"><font color="#4d71a1">User name:</font> </td>
<td><input name="UserName" size="25" type="Text" autocomplete="OFF"></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td align="right"><font color="#4d71a1">Password:</font> </td>
<td><input name="Password" size="25" type="Password" autocomplete="OFF"></td>
<td> </td>
</tr>
PHP script:
<?
if ($_POST["BtnPress"]=="Pressed")
{
if ($_POST["Username"]=="*****" && $_POST["password"]=="*********")
{
$_SESSION['AdminID']="1";
header("Location: "."index.php");
}
else
{
print "<font color=#ff0000>Sorry you cannot access this part of the site.</font>";
}
}
?>
then the rest of the form:
<tr>
<td align="center" colspan="4">
<input type="hidden" name="BtnPress" value="Pressed">
<input type="Submit" value="Log In" class="mybutton" onclick="return CheckForm();">
</td>
</tr>
</table>
</td>
</form>
The PHP seems unable to find the variable BtnPress, its a similar problem throughout alot of my translated ASP to PHP script. Sorry if it is a simple solution but can anyone tell me where I am going wrong?
You have name="Password" and $_POST["password"]
Password != password
Watch your case.
<form name="LogIn" action="login.php" method="post">
<td bgColor=#ffffff>
That is invalid HTML. A <td> element cannot be a child element of a <form>. Browsers are likely to error recover in ways that break your HTML (e.g. by moving the form, but not its contents, outside the table). Do use a validator.
And stuff that isn't likely to be the cause of the problem, but is likely to be the cause of other problems.
Don't use layout tables
Do use the label element
Do use CSS for presentation (you can style your label elements instead of using the obsolete font element
Do not use a hidden input to test if a form is submitted.
use:
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
// processing of $_POST
}
The name of the submit button should be "BtnPressed" not the hidden field.
What I would do would be to set the form action to ?id=submit or something like that, and then check "if $_GET['id'] == "submit" then process data.
<form action="login.php?do=submit">
.... <input .....
</form>
<?php
if($_GET['do'] == "submit"){
//process data
} ?>
I wrote this code (which posts to a PHP page) so that if guests do not input their name, it would pop out an alert box. However, Even when I put something in the name textbox and submit it, the alert box still pop out and it would submit the $_POST['gname'] to the server.
Here’s the JavaScript:
<script type="text/javascript">
function gSubmit()
{
if (document.getElementById("gname").value.length === 0)
{
alert("For completing the form, it requires you to input a Name");
return false;
}
else
{
document.getElementById("guestbook").innerHTML=("<p><b><center>Thank you for submitting the Guestbook");
window.location = "guestbook.php";
return true;
}
}
</script>
Here’s the HTML:
<form id="guestbook" name="guestbook" method="post" action="guestbook.php">
<center>
<table border="0px">
<tr>
<td>
<p align="right">Name :</p></td><td> <input type="text" name="gname" id="gname" />
</td>
</tr>
<tr>
<td>
<p align="right">E-mail :</p></td><td><input type="text" name="gemail" />
</td>
</tr>
<tr>
<td>
<p align="right">Telephone No :</p>
</td>
<td>
<input type="text" name="gtpn" />
</td>
</tr>
<tr>
<td>
<p align="right">Product Order / Comment / Messages :</p>
</td>
<td>
<textarea name="gtxtfld" id="gtxtfld" cols="32"></textarea>
</td>
</tr>
</table>
<br /><br />
<input type="submit" value="submit" name="submit" onclick="gSubmit();" />
<input type="reset" value="reset" name="reset" />
</form>
Change your gSubmit() function to this:
if (document.getElementById("gname").value === "")
{
alert("For completing the form, it requires you to input a Name");
return false;
}
else
{
document.getElementById("guestbook").innerHTML=("<p><b><center>Thank you for submitting the Guestbook");
return true;
}
In your html, change onclick="gsubmit()" to onclick="return gsubmit()".
Note that your message in the else clause will not be displayed because the form would have submitted by then.
Also, you have to compare the value of gname field, not it's innerHTML. And it has to be compared to empty string (""), not space (" ").
To check if the textbox has a value in it, you can use something like this:
if (document.getElementById("gname").value.length > 0)
{
alert("For completing the form, it requires you to input a Name");
//by returning false, you stop the submission from happening
return false;
}
else
{
document.getElementById("guestbook").innerHTML=("<p><b><center>Thank you for submitting the Guestbook");
return true; //allow the submission to go through
}
And in you're onclick event:
onclick="return gSubmit();"
I'm using JQuery Form Plugin to upload a file together with PHP, everything works perfectly in Firefox, but in Internet explorer is does not do anything if I submit the form.
My code is below
<script type="text/javascript">
<!--
$(document).ready(function() {
var options = {
target: '#message',
url:'../includes/ajax/import.php?import=1',
beforeSubmit: function() {
$('#uploader').html('<div style="padding-top:10%"><center><img src="../domain/images/ajax-loader.gif" border="0" /></center></div>');
$('#message').toggle();
},
success: function() {
$("#message").removeClass("message").addClass("messageResponse");
$('#message').toggle();
$('#uploader').html('');
}
};
$('#upload').ajaxForm(options);
});
//-->
</script>
<div id="message" class="message">
<form name="upload" id="upload" action="#" method="POST" enctype="multipart/form-data">
<table cellpadding="4" cellspacing="4" border="0">
<tr>
<td colspan="3"><h1>Map Clients <i>(Import CSV File)</i></h1></td>
</tr>
<tr>
<td class="fieldLabel" nowrap>File:</td>
<td nowrap><input type="file" name="fileToUpload" id="fileToUpload" /> *</td>
<td nowrap id="errorFile" class="error"></td>
</tr>
<tr>
<td nowrap colspan="3"><button id="mapClients">Map Clients</button></td><td nowrap id="errorFile" class="error"></td>
</tr>
<tr>
<td colspan="3"><input type="hidden" value="1" id="type" name="type" /></td>
</tr>
</table>
</form>
</div>
<div id="uploader"></div>
Now my problem is that I can't figure out why IE 7 is not doing anything when I click on my form submit button
I seem to recall running into the same problem. Try this:
$(document).ready(function() {
var options = {...
/*abridged for clarity*/
$('#upload').submit(function() {
$(this).ajaxSubmit(options);
return false;
});
});
I found the issue
In my HTML I had something like this
<tr>
<td nowrap colspan="3"><button id="mapClients">Map Clients</button></td><td nowrap id="errorFile" class="error"></td>
</tr>
I changed it to
<tr>
<td nowrap colspan="3"><input type="submit" id="mapClients" value="Map Clients" /></td><td nowrap id="errorFile" class="error"></td>
</tr>
And the problem was solved
I had a problem with the JQuery Form Plugin in ie8. The piece of code that started the "ajax form" was located in a "dynamical div" that was updated later then the main page. Moving that call to the main page got ie8 working for me.
Had a similar problem with IE as well. In my case the problem was happening because I was disabling the file input element (input[type=file]) in beforeSend (for cosmetic and usability reasons). Only IE had a problem with the input element being disabled.