i am designing a register form for a site.in this form in html forms we have to password type
and a submit button.
<form action="index1.php" method="post">
<b>pass:</b> <input type="password" name="pass" size="25"/>
<b>pass:</b> <input type="password" name="cpass" size="25"/>
<input type="submit" name ="submit" value="comfirm">
on of them are for pass and second for confirm password and a button for submit.
user must fill both of pass and cpass fields until program can store in database
i want that when user click on submit button (for speed up my program) my program check that if two fields are filled are no.if they have filled connect to database and store them into database or if no show a alert to user and doesn't connect to database.
my database codes are in index1.php.
if it possible i check them with javascript functions with onclick in submit?
(i could retrieve form values into a javascript functions and checked them but could not stop program and so it go to index1.php and connect to database that i don't need)
if yes how?
if no how can i do that.
if it possible in javascript me go to a particular page in php for example 5.php?
Use the onsubmit event on the form element:
<form action="..." onsubmit="return validate_fields();">
The return keyword is important here. Inside your validate_fields, return false if the check fails or true if it succeeds:
function validate_fields() {
...
if(fields_is_valid) {
return true;
}else{
alert('Fill in all fields!');
return false;
}
...
}
This will stop the form from being sent if the validation fails.
Related
I want to validate my form input fields on button click in jQuery. But I don't want to use client side validation. How can I add PHP server-side validation on button click?
I am using modal box for form.
I know it is a beginner's level question, but currently I am unable to figure it out because of my low expertise.
Yes you can validate using PHP and it's not a big deal. I'll provide a simple example here to pass the form data to PHP for validation.
<?php
if( isset($_POST['submitForm']) )
{
$userName = $_POST['userName'];
$userAge = $_POST['userAge'];
if ($userAge > 21)
{
echo "Hey " + userName;
}
}
?>
<html>
<body>
<form method="POST" action="">
Name: <input type="text" name="userName">
Age: <input type="number" name="userAge">
<input type="submit" name="submitForm" value="Validate">
</form>
</body>
</html>
If you wish to pass the data to another page to validate, just give the file name in action attribute, like action="Your_PHP_File.php" and validate separately. Just a tip: If you wish to redirect on success (heavily used):
header("Location: Your_URL_Here");
Anyways, this is not a better user experience. You must use client side validation using JavaScript/any JavaScript framework, and use language like PHP only to communicate with the server, such as storing the data in the database, retrieving data from the database.
Currently I am coding a function where a user from a website can enter a new password. The form is as follows:
<form action="php\change-password.php" method="post">
<input type="text" name="newPassword"></input>
<input type="text" name="confirmNewPassword"></input>
<button type="submit">verander wachtwoord</button>
</form>
The entries in both the input fields shouldn't be empty and they should match.
Is there an easy way to check before submitting the form if the input fields aren't empty and if they match.
I tried doing it with PHP but without any result.
You could use jQuery for this.
$('form').on('submit',function(){
if($(this).find('input[name="newPassword"]').val() != $(this).find('input[name="confirmNewPassword"]').val()){
// show error
return false;
}
});
I would strongly advice to also implement post-submit validation. Jquery validation can easily be worked around.
Here are two forms fregister and register. In first form I am taking input of name,username and checking the availability of username by clicking on Check user id button.If username is not available I am displaying message with the help of php and want to show this message to user with the fields he filled before.
<?php RegFormCrAndValid($name,$username,$email) {?>
<form name="fregister" method="post">
<table>
<tr><td>Name</td>
<td><input type="text" id="name" name="name" value ="<?php echo $name;?>" onChange="ValidAllAlpha()" required></td>
<td><span id="ErrorName"></span></td></tr>
<tr><td>Username</td>
<td><input type="text" id="user" name="UsrText" value="<?php echo $user;?>" required onblur="SetNextElement()"></td>
<td><?php echo $_SESSION['ErrorUserMsg']?></td> <td><input type="submit" name="CheckUsr" value="Check User ID"></td> </tr> </form>
In second form, the user will register here first checking the availability and then submission will take place by clicking on register.In this form too if user has not registered successfully then I want to show message with fill fields.
<form name="register" method="post">
<td style="display:none"><input type="text" id="fname" name="fname" required></td>
<td style="display:none"><input type="text" id="fuser" name="fuser" required></td>
<tr><td>Email</td>
<td><input type="email" id="email" name="email" value="<?php echo $email;?>" onChange="ValidateEmail()" required></td>
<td><span id="ErrorEmail"></span></td></tr>
<tr><td><input type="submit" name="submitForm" value="Submit" onClick="ValidationCheckOnSubmit('register');return false;"></td></tr>
</form>
</body>
</html>
Two rows are not displayed here because they are taking the values of name and username from the form fregister with the help of javascript and then displaying them.
JavaScript Codes // validations are there, here I am mentioning the code for passing values to fname and fuser
function SetNextElement()
{
document.getElementById('fname').value = document.getElementById('name').value;
document.getElementById('fuser').value = document.getElementById('user').value;
}
<?php }?> //RegFormCrAndValid($name,$username,$email) this function getting closed over here
php coding
if(isset($_POST['CheckUsr']))
{
if(IsUsernameAvail($_POST['UsrText'])) //IsUsernameAvai checking for the username availabilty return true if available as false
{
$_SESSION['ErrorUserMsg']="<font color=red>This Username Is Available</font>";
}
else
{
$_SESSION['ErrorUserMsg']="<font color=red><--Username is not available</font>";
}
}
if(isset($_POST['submitForm']))
{
if(IsUsernameAvail($_POST['fuser']))
{
echo 'You have been successfully registered';
}
else
{
$_SESSION['ErrorUserMsg']="<font color=red><--Username is not available</font>";
RegFormCrAndValid($_POST['fname'],$_POST['fuser'],$_POST['email']);
//RegFormCrAndValid($name,$username,$email) is the function in which whole html and javascript code is there to create and validate the form.
}
}
else{ if(isset($_POST['CheckUsr']))
{
RegFormCrAndValid($_GET['name'],$_POST['UsrText'],'');
}
else RegFormCrAndValid('','','');
}
My problems
While on clicking CheckUserId button I want the page to stay over there only, why after clicking it doesnt stay on same page with all field fill as they were filled by user. It should just perform the check, why does page reloads?
If I am able to stay over the same page then I dont need to call RegFormCrAndValid($name,$username,$email) this function again to rebuild my form, is it possible to stay there with filled fills and not calling function.
I want to eradicate the use of fake columns to show username and name again because in real registration form there are going to be lot of fields and I cant have fake calling or assignment for all of them.
I dont want to use ajax or jquery, want to achieve everything through javascript,php and html.
When you are clicking on <input type="submit" name="CheckUsr" value="Check User ID"> the form is being submitted, because thats what clicking on submit buttons do, unless you have javascript to block it and do something else.
When a page is being submitted back to the server, the page will reload.
Now, over to your basic goal : you must understand that the actual checking which you are doing to determine whether username is available or not, is on the server side, that is, the logic resides on the server. Whereas, the form which the user is typing the username on, is on the client side, that is residing on the users computer, being displayed through the browser. Now once the user types the name, you somehow need to pass that data over to the server side for it to do the checking and perform actions accordingly. Therefore you have two options:
a) Submit the form as you are now, and use server side php code to collect all the data filled by the user and populate them back again
b) donot submit the form, just make an ajax request to a php script, which will take as input the username and return to you either a true or false response which you can catch using javascript, and accordingly allow the form to be submitted or not submitted.
In that case either on the submit buttons onclick event or the forms onsubmit event trigger set a javascript function to make the ajax request and "return false" if the ajax request returns false or "return true" if the ajax request returns true. Also in the "false case" you can use getElementById to set the error message for the user.
Answer for (a)
You are using form submit action
Default behaviour of form submit is it will reload the page. You have to suppress the default behaviour of form submit by using return false .But it is not recommended.. you can use AJAX
Sample Code
$('#yourFormId').submit(function () {
//business logics here
return false;//to avoid page reload
});
You don't need any more the onclick event on the submit button:
<input class="submit" type="submit" value="Send" />
I am trying to save my form data into a wordpress database before submitting it. Please help. Heres my code and the php code to insert into database:
<form method="post" action="https://app.icontact.com/icp/signup.php" name="icpsignup"
id="icpsignup1030" accept-charset="UTF-8" onsubmit="return verifyRequired1030();">
<input type="hidden" name="redirect" value="http://www.123.com/thank-you.html">
<input type="hidden" name="errorredirect" value="http://www.123.com/error.html">
<input type="hidden" name="listid" value="16360">
<input type="hidden" name="specialid:16360" value="MA3A">
<input type="hidden" name="clientid" value="1259610">
<input type="hidden" name="formid" value="1030">
<input type="hidden" name="reallistid" value="1">
<input type="hidden" name="doubleopt" value="0">
<input type="text" name="fields_email" size="21" style="padding:5px;">
<input type="image" name="submit" src="signup button top.png" value="" height="32px">
</form>
And the code to insert into DB:
<?php
require_once('../../../wp-config.php');
global $wpdb;
$table_name = "icontact_emails";
$email = $_POST[fields_email];
if (trim($email) != ""){
$wpdb->insert($table_name, array('email' => $email, 'timestamp'=> date("Y- m-d h:i:s")));
}
?>
"Submitting" is the only way to transfer it to the server, whether you submit the form via AJAX or traditional methods - no difference.
Remember, this is a client-server model. The form is on the client, the DB is on the server.
I can INFER from your question that you really mean: I am trying to save this form to a database before I submit it to ANOTHER SITE which I don't control. Meaning you want to save it to your own database before you submit the data to a 3rd party.
If that's the case here's what I recommend:
Use the form's onSubmit event (<form onSubmit="YourJavasScriptMethod();">). Use JQuery and $.ajax() to read all of your form inputs and submit them to your own script which can save the values to the database. At the end of your onSubmit method be sure to return true so the browser will continue to submit the form.
Here's a pseudo-code example:
<form id="myForm" onSubmit="SaveToMyOwnDatabase();">
<input />... //your inputs
</form>
and your javascript:
function SaveToMyOwnDatabase()
{
// Create Json object by selecting each of the form inputs
// Call $.ajax and submit the Json to your script which processes the json
return true;
}
I would recommend using Contact Form 7 (WP plugin). There is a PHP hook built in that you can use to do this called wpcf7_before_send_mail. It will pass an object with all of the contact form data to your custom function(s) which you can use to write to the database or do other server side stuff. Here's a (really) short example (this goes in functions.php):
add_action( 'wpcf7_before_send_mail', 'save_contact_to_db' );
function save_contact_to_db( $cf7 ) {
$email = $cf7->posted_data['fields_email'];
// put database writing stuff here
}
There is a little more info to be had here. Also this link should be helpful since it's people discussing how to do exactly the same thing you are asking. There is also a plugin that will automatically write CF7 or Jetpack form submissions to the database for you but I've never used it so I can't comment on it. In general though I recommend using contact form 7 for this, especially since you are sending the form post data to a php script that is not on your server.
I think the solution is simple : submit your form to a PHP page that will : 1) save it in your database and 2) send it wherever you want. By far the simplest and most used solution in your case!
Here is my scenario, I present the user with a table of tests, which I have retrieved from my database in a loop and created a form for each test(row of table). So each has a submit button to execute that particular test.
basics of my loop:
while ($ts = mysql_fetch_assoc($test_info))
{
//PRESENT VALUES $ts['name'] in table within a unique form etc.
}
What I am trying to do and failing is, on clicking a particular submit button for a test, to run a JS function which checks; if the test has a password attached, if it does, present a popup form for password input, and on submitting that small form check if password is correct, if it is submit the original test form.
My problem is that I cannot parse the password value attached to that form to my javascript.
so ideally i want to do this:
<input id='submit' type='button' onclick='JSfunction(test_password)' value='execute test' >
So I can somehow parse a value from that particular form to a javascript function without actually submitting the form.
and I believe I know how to do the rest in my JSfunction.
I hope somebody can follow my poor explanation and point me in the right direction.
Many thanks,
When a form should have a password associated with it, add the following:
<input type="hidden" name="has_password" value="yes" />
<input type="hidden" name="password" value="" />
Then, in your check triggered by the submit button (assuming the button itself is the this context):
if ($(this).parent().find(':input:hidden[name=has_password]').val() == 'yes') {
// pop password request
return false;
}
You'll need a way to store the context of the current form, and I can suggest a few if you like, but you can then populate the password into the hidden field for it and submit as normal. By the way, you might want to consider onSubmit instead of the submit button's onClick, as onSubmit will catch attempts by scripts to perform a submit. If you do this, just remove the .parent() portion of the above, as the <form> element should be the this context.