php isset($_post[]) and javascript form.submit - javascript

for some reason isset($_post) doesn't work when i use js form.submit()
how i can resolve that without changing type of input from button to submit and just with using vanilla javascript because i need both of them.
code html:
<form name="user_verification" action="action.php" method="POST">
Name: <input type="text" name="name"><br>
E-mail: <input type="text" name="email"><br>
<input type="button" onclick="myFunction(this)" name="button" value="submit">
</form>
and here is the php script in action.php file
if($_SERVER['REQUEST_METHOD']=="POST")
{
if(isset($_POST['button']))
{
echo 'yes';
}else{
echo 'no';
}
}
and here is the javascript in action.js file
function myFunction(button)
{
//some code
const form=button.parentNode;
form.submit();}

Actually the problem didn't raise from the PHP. Buttons' value is sent when the form is directly submitted by them (In this case, it seems impossible).
Suggestion 1: use another field to check form submission.
if($_SERVER['REQUEST_METHOD'] == 'POST') {
if(isset($_POST['email'])) {
echo 'yes';
} else {
echo 'no';
}
}
Suggestion 2: add hidden input in the HTML.
<form name="user_verification" action="test.php" method="POST">
Name: <input type="text" name="name"><br>
E-mail: <input type="text" name="email"><br>
<input type="hidden" name="button" value="submit">
<input type="button" onclick="myFunction(this)">
</form>
Suggestion 3: change button type to hidden before submitting.
function myFunction(button) {
// some code
button.setAttribute('type', 'hidden');
const form=button.parentNode;
form.submit();
button.setAttribute('type', 'button');
}

Related

how to give name in auto submit form javascript

This is my code that I am using to submit form with post value
<form action="<?php echo DOMAIN; ?>contact/booking-form.php" method="post">
<input type="text" name="name" value="<?php echo $name; ?>" />
<input type="text" name="email" value="<?php echo $email; ?>" />
<input type="submit" name="submit" id="submit" />
<script>document.getElementById('submit').submit();</script>
</form>
Can anybody help me to pass name="submit" value of submit button to another page?
A submit button is only going to be a successful control if it is used to submit the form (and even then only if it has a name and a value … which yours does not).
If you want submit=submit in your form data when you submit the form with JavaScript, then don't use a submit button to put that data in the form in the first place. Use a hidden input.
<input type="submit">
<input type="hidden" name="submit" id="submit" value="submit">
Then you have two other problems.
First, submit is a method of form elements, not inputs. So you need to change your script to call the right element.
<script>document.getElementById('submit').form.submit();</script>
Second, if a form has a control called submit then that will clobber the submit method. So you need to get one from a different form (not supported in old versions of Internet Explorer):
<script>
var form = document.getElementById('submit').form;
var submit_method = document.createElement("form").submit;
submit_method.call(form);
</script>
<form id=submit action="<?php echo DOMAIN; ?>contact/booking-form.php" name="form1" method="post">
<input type="text" name="name" value="<?php echo $name; ?>" />
<input type="text" name="email" value="<?php echo $email; ?>" />
</form>
<script >
document.form1.submit()
</script>
there is no sumit button in your code. first add in html
<input type="submit" value="submit" id="submit"/>
<script>
document.getElementById("submit").value = "newSubmitButtonValue";
</script>

onClick() to perform function?

Is it possible for in a form of username and password to perform JS validation with the onClick()?
Here is the code:
<form action="signup.php" method="post" name="formInput" onclick="validateForm()">
Username: <br> <input type="text" name="username" placeholder="Username"><br>
Password <br> <input type="password" name="pass" placeholder="Password"><br>
<input type="submit" name="submit">
</form>
I remember doing it before but cannot remember where to call the actual onClick() in the form creation or in the button submission?
Thanks for any suggestions.
<script>
function validateForm() {
// if valid return true else false
}
</script>
<form action="signup.php" method="post" name="formInput" onsubmit="return validateForm()">
Username: <br> <input type="text" name="username" placeholder="Username"><br>
Password <br> <input type="password" name="pass" placeholder="Password"><br>
<input type="submit" name="submit">
</form>
As soon as the submit-button is clicked, signup.php gets executed and your validateForm() is ignored. I do not know why you are trying to validate the data with JavaScript instead of inside the signup.php itself. Furthermore it is almost certainly a huge security-flaw to do the validation on the front-end.
What I suggest you do is to forget about validating in JavaScript, and do it in PHP instead. If you post your validateForm() code we can help you translating it into PHP (and probably improve it as well).
Edit: You have stated that your validation is to make sure the input fields are not empty. So here we go:
<?php
session_start();
$username = $_POST['username'];
$pass = $_POST['pass'];
if (strlen($username) < 1 || strlen($pass) < 1) {
header(...); //redirect back to the home-page
$_SESSION['message'] = "Username and password must be filled out.";
}
... //rest of your signup.php
?>
and change the extension of your HTML-page to .php, then add this to the top:
<?php
session_start();
echo("<script> alert('" . $_SESSION['message'] . "'); </script>");
?>
This seems like overkill for such a simple task, and probably is. However you will want to check for other things than the emptiness of the fields, and that has to be done in this way.
However, if you do not care and want a simple way to do it, you can probably disable the submit-button with JavaScript somehow until both fields are filled. Check if both fields are filled with something like onChange = validateForm() function.
SOLUTION:
<form action="signup.php" method="post" name="formInput" onsubmit="return validateForm()">
Username: <br> <input type="text" name="username" placeholder="Username"><br>
Password <br> <input type="password" name="pass" placeholder="Password"><br>
<input type="submit" name="submit" onsubmit="validateForm()">
</form>

how to submit the single form and use two submit button one button click then validate

<form>
<input type="submit" name="submit" id="formSubmit" value="SAVE FOR NOW" />
<input type="submit" name="submitAndConfirm" id="submitAndConfirm" value="CONFIRM AND UPLOAD TO SERVER" />
</form>
$(document).ready(function(){
$('#addPat').submit();
$('#submitAndConfirm').click(function(){
$('#addPat').validate({
rules:{
iscosId:{required:true},
pat_id:{required:true},
admissionDate:{required:true},
dischargePlace:{required:true}
},messages:{
iscosId:"Please reload the Page",
pat_id:"This field cannot be empty",
admissionDate:"This field cannot be empty",
dischargePlace:"This field cannot be empty"
}
});
});
});
What I want is; when I submit the formSubmit button I want form to not validate, but when I click submitAndConfirm button I want validate the form to be validated.
<script>
$(document).ready(function(){
...
});
</script>
Anyway, I would check it with php.
<?php
if (isSet($_POST['submit'])) {
if ($_POST['submit'] == "SAVE FOR NOW") {
//Your PHP testing & action code
} else { //or elseif ($_POST['submit'] == "CONFIRM AND UPLOAD TO SERVER"
//Your PHP code
};
};
?>
you can try this if I have completely understood the problem.
when you want a form to be saved by a button and to be submitted by a another button, you have to use the attribute "formnovalidate" at the end of the buttton as bellow:
<form action="" method="get" novalidate>
<p><label for="Text1" >First Name: </label><input name="Text1" type="text" required></p>
<p><label for="Text2">Last Name: </label><input name="Text2" type="text"></p>
<p><label for="Text3">Favorite Color: </label><input name="Text3" type="text"></p>
<p><input name="Submit1" type="submit" value="submit"> </p>
<p><input name="Save" type="button" value="save" formnovalidate> </p>
</form>
Try this
$(document).ready(function(){
$('#formSubmit').click(function(){
$('#addPat').submit();
});
$('#submitAndConfirm').click(function(){
$('#addPat').validate({
rules:{
iscosId:{required:true},
pat_id:{required:true},
admissionDate:{required:true},
dischargePlace:{required:true}
},messages:{
iscosId:"Please reload the Page",
pat_id:"This field cannot be empty",
admissionDate:"This field cannot be empty",
dischargePlace:"This field cannot be empty"
}
});
});
});

Two actions two submit button in php?

I've form tag like this
sample name:register.php page
<form id="formElem" name="formElem" action="form10.php" method="post">
<input id="pd" name="pd" type="text" AUTOCOMPLETE=OFF />
<input id="pd1" name="fname" type="text" AUTOCOMPLETE=OFF />
<input id="pd2" name="mname" type="text" AUTOCOMPLETE=OFF />
<input id="pd2" name="lname" type="text" AUTOCOMPLETE=OFF />
6 more input boxes
<button name="submit" type="submit">Register</button>
<button name="preview" type="submit">Preview</button>
</form>
I'm sending this info to next form10.php page and displaying all the 10 input values on that page
I'm using $pd= htmlentities($_POST['pd']); $fname= htmlentities($_POST['fname']); to fetch values from form tag and such 10 variables and I'm echoing those entered value
on form10.php file after successful submit button.
like i entered fname, mname, lname came from form tag and displayed on form10.php page.
first name <?echo $fname?>
but now problem is user can see the next page (form10.php) after entering only 10 textboxes values inside form tag.
but I want to give preview option to user so that user can preview that next page either filling any of 1 to 10 textbox values. means he has filled fname and lname but not rest of 8 fields and he clicks on preview button I want to open form10_preview.php which same as form10.php but as user has entered only fname and lname so echo only those values which he as supplied.
Now problem is how can i can have two submit button and two actions in one form?
I think it is better to control form submit rules clientside. Remove the action from your form, and change the button type to be button :
<form id="formElem" name="formElem" action="" method="post">
<input id="pd" name="pd" type="text" AUTOCOMPLETE=OFF />
<input id="pd1" name="fname" type="text" AUTOCOMPLETE=OFF />
<input id="pd2" name="mname" type="text" AUTOCOMPLETE=OFF />
<input id="pd2" name="lname" type="text" AUTOCOMPLETE=OFF />
6 more input boxes
<button id="register" type="button">Register</button>
<button id="preview" type="button">Preview</button>
</form>
Then let javascript control the flow of the submitting :
var formElem = document.getElementById('formElem'),
btnSubmit = document.getElementById('register'),
btnPreview = document.getElementById('preview');
function formSubmit() {
switch (this.id) {
case 'register' :
formElem.action='post10.php';
break;
case 'preview' :
formElem.action='preview10.php';
break;
}
formElem.submit();
}
btnSubmit.onclick = formSubmit;
btnPreview.onclick = formSubmit;
You could have the form point to its own page and handle each submit value separately. At the top of the file with the form, you'll need to start the output buffer and a session. This allows the use of header() to redirect, and storage of session variables.
<?php
ob_start();
session_start();
?>
The form will point to itself by removing the action attribute:
<form id="formElem" name="formElem" method="post">
<input id="pd" name="pd" type="text" AUTOCOMPLETE=OFF />
<input id="pd1" name="fname" type="text" AUTOCOMPLETE=OFF />
<input id="pd2" name="mname" type="text" AUTOCOMPLETE=OFF />
<input id="pd2" name="lname" type="text" AUTOCOMPLETE=OFF />
6 more input boxes
<button name="submit" type="submit">Register</button>
<button name="preview" type="submit">Preview</button>
</form>
We process each of the buttons via their name in the POST array:
<?php
if(isset($_POST['submit'])){
foreach ($_POST as $key => $value) {
$_SESSION[$key] = $value;
}
header("Location: form10.php");
}
if(isset($_POST['preview'])){
foreach ($_POST as $key => $value) {
$_SESSION[$key] = $value;
}
header("Location: form10_preview.php");
}
?>
And at the very end of the file, we flush the output buffer:
<?php ob_end_flush(); ?>
So, essentially the form has one action, which is to submit the values to itself. Finally, both form10.php and form10_preview.php will need session_start(); at the top of the file to access the Session variables we've created, like so:
<?php
session_start();
$inputs = array("pd", "fname", "mname", "lname", etc...);
foreach ($inputs as $input) {
echo $_SESSION[$input];
}
?>

HTML button onClick listener calling HTML form onSubmit javascript function

I am a novice in web development, I have created a simple html page. The page has two buttons, Submit and Display Data. The Submit button is supposed to post form data to a particular page after validating the form. This button is working fine. I am facing a problem with the Display Data button. The button is supposed to open a separate page and there should not be any kind of form validation. The page is getting open but the form is also getting validated.
The html page:
<html>
<head>
<script>
function validateForm()
{
var name=document.forms["myForm"]["name"].value;
var email=document.forms["myForm"]["email"].value;
var mobile=document.forms["myForm"]["mobile"].value;
var address=document.forms["myForm"]["address"].value;
var atpos=email.indexOf("#");
var dotpos=email.lastIndexOf(".");
if (name==null || name=="")
{
alert("Name must be filled out");
return false;
}
else if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length)
{
alert("Not a valid e-mail address");
return false;
}
else if(isNaN(mobile)||mobile.indexOf(" ")!=-1)
{
alert("Enter numeric value")
return false;
}
else if (mobile.length != 10)
{
alert("Enter 10 digit mobile");
return false;
}
else if (mobile.charAt(0)=="0")
{
alert("Mobile no should not start with 0");
return false;
}
else if (address==null || address=="")
{
alert("Address must be filled out");
return false;
}
}
</script>
</head>
<body>
<h2>Employee Details Entry</h2>
<form name="myForm" action="insertDisplay.php" onSubmit="return validateForm()" method="post">
Name: <input type="text" name="name"><br/>
Email: <input type="text" name="email"><br/>
Mobile: <input type="text" name="mobile"><br/>
Address: <input type="text" name="address"><br/>
<input type="submit" value="Submit"> <button onClick="location.href = 'insertDisplay.php'">Display Data</button>
</form>
</body>
</html>
Where am I going wrong? Why is the form validation function getting called?
place
<button onClick="location.href = 'insertDisplay.php'">Display Data</button> this line out of the form...
give this button the type you want to behave it.
<button type="button" onClick="location.href = 'insertDisplay.php'">Display Data</button>
You can take the values out of the form, or you can use, <input type="button"/> tag. It will not submit your form and will work as you intended.
<input type="button" value="display data" onClick="location.href = 'a.php'">
I suppose you also want your datas to be passed to your PHP file after clicking your button ?
If you push the out of the form will not be sended and you'll have no datas.
In fact, you want both buttons to submit your form, but only the first one should validate it ?
If this is it you can do this :
<form name="myForm" action="insert.php" method="post">
Name: <input type="text" name="name"><br/>
Email: <input type="text" name="email"><br/>
Mobile: <input type="text" name="mobile"><br/>
Address: <input type="text" name="address"><br/>
<input type="submit" name="typesubmit" value="Submit" onclick="return validateForm();" />
<input type="submit" name="typesubmit" value="Display Data" />
</form>
You'll be abled on your insert.php file to make difference between display and submit by checking $_POST['typesubmit'] value.
And if you want your "display" button to post your form on another php file, you can do this :
<form name="myForm" action="insert.php" method="post">
Name: <input type="text" name="name"><br/>
Email: <input type="text" name="email"><br/>
Mobile: <input type="text" name="mobile"><br/>
Address: <input type="text" name="address"><br/>
<input type="submit" value="Submit" onclick="return validateForm();" />
<input type="submit" value="Display Data" onclick="document.myForm.action='display.php';" />
</form>

Categories

Resources