Validate form with ISSET when using js delay function - javascript

I am trying to validate if the correct form is being sent with isset(), but this validation is not TRUE when a javascript delay is being applied. How come? What is the best way to check if the correct form was submitted via the POST method? See my code below. Maybe a hidden field would do the trick, but I actually really would like to know why the below code is not going through.
<script type="text/javascript">
window.addEventListener('load', function onload(){
var ccform = document.getElementById('cc_form');
if(ccform){
ccform.addEventListener('submit', function before_submit(e){
setTimeout(function wait(){
// After waiting, submit the form.
ccform.submit();
}, 2000);
// Block the form from submitting.
e.preventDefault();
});
}
});
</script>
<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['cc_form_submit'])) {
//Send the form
//Not working
echo 'ready to send!';
}
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
//Send the form
//Working
echo 'ready to send without ISSET!';
}
?>
<form action="" method="post" class="cc_form" id="cc_form">
<button class="cc_form_submit" type="submit" name="cc_form_submit">Send!</button>
</form>

In your example, there are so many possible solutions:
Solution 1:
You can use a hidden value inside your form and then check this value in isset() method like:
<form method="post">
<input type="hidden" name="form1" />
<button>Submit</button>
</form>
<form method="post">
<input type="hidden" name="form2" />
<button>Submit</button>
</form>
<?php
if(isset($_POST['form1'])){
// do somthing
}
if(isset($_POST['form2'])){
// do somthing
}
?>
Solution 2:
You can use input type submit instead of <button> like:
<form method="post">
<input type="submit" name="form1">
</form>
<form method="post">
<input type="submit" name="form2">
</form>
<?php
if(isset($_POST['form1'])){
// do somthing
}
if(isset($_POST['form2'])){
// do somthing
}
?>
Solution 3:
You can use different action for multiple <form> like:
<form method="post" action="form1.php">
</form>
<form method="post" action="form2.php">
</form>
Edit:
As per your comment
don't know why if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['cc_form_submit'])) { is not working.
Its not working because, you are using name= attribute with <button>, in this case solution 2 will work for you.

Related

Submit checkbox value on form without page refresh AJAX PHP

I just started learning ajax and its really great and time saving i agree.
But i got stuck at this point sending form data without page reload.
Below is my html code.
<form id="form4" method="post">
<input type="checkbox" name="test" id="agreed" value="check">
<br>
<br>
<input type="submit" id="form-submit" name="submit" value="Send">
<p class="form-message"></p>
</form>
Below is my Ajax script
<script>
$(document).ready(function() {
$("#form4").submit(function(event) {
event.preventDefault();
var action = 'another_test';
var agreed = $("#agreed").val();
var submit = $("#form-submit").val();
$(".form-message").load("test3.php", {
test: agreed,
submit: submit,
action: action
});
});
});
</script>
Below is my php code
<?php
if (isset($_POST['action'])) {
if ($_POST['action'] == 'another_test') {
$test = $_POST["test"];
$errorEmpty = false;
if (!empty($test)) {
echo "<p>Click the checkbox pls</p>";
$errorEmpty = true;
}
else {
echo "<p>Checkbox clicked</p>";
}
} else {
echo "Error.. cant submit";
}
}
?>
<script>
var errorEmpty = "<?php echo $errorEmpty ?>";
</script>
The php file is on another page called test3.php
This particular code works if it was an input text but doesn't work for a checkbox.
Please help me so i can learn well.
Thanks in advance.
.load() (as per the documentation) performs a GET request, not a POST, but your PHP is (as shown by the $_POST references) expecting a POST request - and it usually makes sense to submit form data using POST.
So you'd be better to use $.post() - this will send a POST request. Then you can handle the response and load it into your "form-message" element in the "done" callback triggered by that request.
N.B. You could also make the code shorter by putting the "action" variable as a hidden field in the form, and then simply serialize the form in one command instead of pulling each value out separately.
Example:
HTML:
<form id="form4" method="post">
<input type="checkbox" name="test" id="agreed" value="check">
<br>
<br>
<input type="submit" id="form-submit" name="submit" value="Send">
<input type="hidden" action="another_test"/>
<p class="form-message"></p>
</form>
JavaScript
$(document).ready(function() {
$("#form4").submit(function(event) {
event.preventDefault();
$.post(
"test3.php",
$(this).serialize()
).done(function(data) {
$(".form-message").html(data);
});
});
});
Documentation:
jQuery Load
jQuery Post
jQuery Serialize

Redirect to URL with value in a search form using ACTION and POST method

I have a search form, where user enter a keyword:
<form method="post" action="domain.com/gallery/<?php echo $_POST["something"]; ?>" >
<input type="text" name="something" required/>
<input type="submit"/>
</form>
<?php
if (isset($_POST["something"])) {
echo $_POST["something"];
}
?>
I want go to url "domain.com/gallery/keyword" after form submission.
The problem is that I can't, with the code above it redirects to "domain.com/gallery/", without keyword value...
I'm using POST and ACTION, because "isset($_POST["something"])" is not working with other methods like onsubmit, e.g. "onsubmit="window.location = 'domain.com/gallery/' + something.value; return false;""
I think you have to change the value of action attribute. You can doing it with javascript:
<form method="post" action="domain.com/gallery/" onSubmit="changeTarget(this)">
The javascript:
function changeTarget(currentForm)
{
//read initial attribute value
actionAttribute = currentForm.getAttribute('action');
//read form field value
enteredKeyword = currentForm.omething.value;
//Concantinate both values and set it as new target
currentForm.setAtrribute('action') = actionAttribute + enteredKeyword;
//Nessacary return statement
return true;
}
Try this
<form method="post" action="{samePage}.php" >
<input type="text" name="something" required/>
<input type="submit"/>
</form>
<?php
if (isset($_POST["something"])) {
$url="domain.com/gallery/".<?php echo $_POST["something"];
header("Location: $url")?>
}
?>

How to simply post javascript data to PHP with HTML form

I have this in my javascript code:
var data = signaturePad.toDataURL('image/png');
document.write(data);
the output looks slimier to that:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAADICAYAAADGFbfiAAAHFklEQVR4Xu3VsQ0AAAjDMPr/0/yQ2exdLKTsHAECBAgQCAILGxMCBAgQIHAC4gkIECBAIAkISGIzIkCAAAEB8QMECB...
Instead of document.write(data); I want to post the data to the self page by using a simple HTML form with hidden filed that can hold the data from JS. then, I want to use PHP to handle $_POST and store the data in a variable...
<?php
// check for form submission...
if(isset($_POST['send'])) {
// get the data
$data = $_POST['data'];
}
?>
HTML form:
<form method="post">
<input type="hidden" name="data" value="">
<input type="submit" name="send" value="submit">
</form>
I understand that I can somehow do it with AJAX but I couldn't figure out with the form, how should I get this done?
I guess that I'm looking for 2 solutions - first, how to use the form with JS to store the data in the hidden field and afterwords, maybe how to post it via AJAX to PHP if it can't be just posted to the same page...
There is a lot of ways to achieve this. In regards to the way you are asking, with a hidden form element.
change your form to:
<form method="post" name="myform" method="post" action="script.php">
<input type="hidden" name="data" value="">
<input type="submit" name="send" value="submit">
</form>
Javascript:
var data = signaturePad.toDataURL('image/png');
document.myform.data.value = data;
document.forms["myform"].submit();
Or Jquery:
var data = signaturePad.toDataURL('image/png');
$('form input[name="data"]').val(data);
$("form").submit();
use like this
<?php
$data="<script>signaturePad.toDataURL('image/png')</script>";
?>
<form method="post">
<input type="hidden" name="data" value="<?php echo $data; ?>">
<input type="submit" name="send" value="submit">
</form>
works all the time.

Javascript/PHP auto submit keeps submitting form

This code:
<?php
if(isset($_GET['submit']))
{
?>
<head>
<script type="text/javascript">
document.getElementById('up').submit(); // SUBMIT FORM
</script>
</head>
<?php
}
?>
form:
<form name="up" id="up" action="" method="post">
<textarea name="text" rows="40" cols="100"></textarea>
<input type="submit" name="ingameban" value="Save in-game banlist (Upload to server and make new bans take effect)" style="height: 64px; width: 550px;" />
</form>
Keeps looping all the time, the same result as smashing the reload button.
It has to submit the form when the url states ?submit=submit
What to do to fix this?
Thanks
Your approach is right, but the problem is that submit=submit in the URL is copied to the new URL used to submit the form. Because in your form you have:
<form name="up" id="up" action="" method="post">
Since action is empty, the exact same URL is used, so submit=submit stays in the URL. Instead, provide the proper URL in action. Then submit=submit won't be copied to the new URL:
<form name="up" id="up" action="/my-url" method="post">
How about setting an input hidden field, which you mark as true when you submit.
Check this field before submitting again.
Try this:
<?php
if(isset($_GET['submit']))
{
if(isset($_GET['submitted']) && $_GET['submitted'] == 'false') {
?>
<head>
<script type="text/javascript">
document.getElementById('submitted').value = 'true';
document.getElementById('up').submit(); // SUBMIT FORM
</script>
</head>
}
<?php
}
?>
<body>
<form method="get" id="up">
<input type="hidden" id="submitted" name="submitted" value="false" />
...
</form>

jQuery detecting if php $_POST isset

I'm new to jQuery, and just wondering if there's a way to detect if a form has been submitted on page load, and if so parsing some code.
I have:
<form action="/login/register" method="post">
<input type="text" value="Username" name="regName"/>
<input type="password" value="Password" name="regPass"/>
<input type="submit" value="Register"/>
</form>
and:
<?php
if (isset($_POST['regName']))
{
//check inputs and add account
}
?>
But i was wondering if i could check if the form had been submitted via jQuery?
Thanks.
Just have PHP set a javascript variable to true if a POST submission was made. Then jQuery just needs to check its value.
<script type="text/Javascript">
var was_posted = <?php echo ('POST' === $_SERVER['REQUEST_METHOD']) ? 'true' : 'false'; ?>
</script>

Categories

Resources