reload form on submit with latest post data - javascript

I have a form to post content into a database. The existing database content for the form is posted into the form as the value. enalbeing the form to show the existing database content.
On submit the database is updated and to view the newly updated content in the form the page must be reloaded.
I have produced a reload script in javascript to reload the page on submit. The page reloads but the php content doesn't update. The page still need to be reloaded manually for the new content to show up.
This is the code for my form.
<form method="POST" action="">
<input type="text" name="title" <?php echo "value=\"" .$row['title']."\">"?>
<textarea id="editor" name="content"><?php echo $row['content']; ?></textarea>
<input type="submit" name="save" value="Save" class="submit" onclick="reload();">
</form>
Javascript
function reload(){
document.location.reload(true);
}
I have also tried
window.location = window.location.href;
Both are relaoding the page but the php isn't being refreshed.

you should first update the db with submitted value before selecting the records to display in the form value.
use <?php $_SERVER['PHP_SELF'] ?> in form action.
mysql_query("UPDATE xyz SET title=$_request['title'],... WHERE id = 1") .
2.Then select query mysql_query("SELECT * from xxx where id =1").
These may solve your problem of reloading to get new values.

java script excecute only on the client side. php is Server side. you need to reload the PHP.
<form method="POST" action="<<NAME OF YOUR PHP>>.php">
<input type="text" name="title" <?php echo "value=\"" .$row['title']."\">"?>
<textarea id="editor" name="content"><?php echo $row['content']; ?></textarea>
<input type="submit" name="save" value="Save" class="submit" onclick="reload();">
</form>

Is there a reason it needs to be done with ajax? If you don't need ajax it's better to handle it with php. ajax is more work and doesn't have the same rate of success as submitting a form via php, sometimes weird things happen. You can just do a redirect after saving the form:
header("Location: /routeToYourPage&id=".$ID,TRUE,303);

Related

PHP form submission alert not working (no ajax)

This is my first question on StackOverflow - thanks in advance for your help!
I have an html form that emails me upon submission. The form submits successfully but I want it to display a submission confirmation message via pop up alert box before reloading the page. Any help is appreciated - though, I'll say now that I don't intend to use AJAX since I am not at all familiar yet. Thanks!
HTML:
<form method="post" action="php/contactForm.php">
<p class="formBox" id="nameBox">Name:</br><input type="text" id="contactName" name="contactName"></p>
<p class="formBox" id="emailBox">Email:</br><input type="email" id="contactEmail" name="contactEmail"></p>
<p>Message:</br><textarea id="contactMessage" name="contactMessage"></textarea></p>
<p><input type="submit" name="submit"></p>
</form>
PHP in "contactForm.php":
<?php
$name = $_POST['contactName'];
$email = $_POST['contactEmail'];
$message = $_POST['contactMessage'];
$body = $name . "\n" . $email . "\n\n" . wordwrap($message);
$alert = "<script>alert('Thank you for reaching out! Someone will be in touch soon.')</script>";
echo $alert;
mail('email#notmyactualemail.com', 'New Message from Website Contact Form!', $body);
header("Location: ../connect.html");
?>
p.s. If it helps to know, I am hosting on GoDaddy.
AJAX works to run code without having to refresh your page. The PHP code you have now will run after the page reloads. Therefore, there is no way without AJAX to send a genuine confirmation message before the page reloads.
You can, however, use the javascript onsubmit property to make a confirmation alert once the form is submitted, but that will not guarantee that the form was indeed submitted without error. Here's an example:
document.getElementById("myForm").onsubmit = function(){
window.alert("This is the confirmation message!\n\nThank you for submitting");
}
<form action="www.example.com" id="myForm" method="POST">
<input type="text">
<input type="submit">
</form>

HTML form doesn't reset after page refresh

I complete the following HTML form in my "main" page(main.php):
<form action="sessions.php" method="post">
<input type="" placeholder="Insert Database Name" name="dbName" id="dbName">
<input type="" placeholder="Insert Server Name" name="serverName" id="serverName">
<input type="" placeholder="Insert User Name" name="userName" id="userName">
<button type="submit" name="Submit" id="sub">Connect</button>
</form>
When the user presses the "Submit" button(I made it to not refresh the page), the form data are posted to another page(sessions.php):
<?php
session_start();
$_SESSION['dbName'] = $_POST['dbName'];
$_SESSION['serverName'] = $_POST['serverName'];
$_SESSION['userName'] = $_POST['userName'];
$_SESSION['password'] = $_POST['password'];
?>
Then, those data are read from another page(graphs.php):
<?php
session_start();
$serverName = $_SESSION['serverName'];
$userName = $_SESSION['userName'];
$password = $_SESSION['password'];
$dbName = $_SESSION['dbName'];
?>
When I refresh the page, the form data are preserved.
How to delete them after page refresh?
Use session_destroy() after you have handled the data (stored in database, performed calculation etc.) HTTP is a stateless protocol, so refreshing the page would not update your session variables because it is the PHP server that is handling the session, completly unrelated to a page refresh.
`Hey Try this with the function method above input methods..
create a simple function
using onclick method in the submit button and put the values=null in side the function
eg.
"function clearForm() {
document.myform.reset();
}"
But the session_destroy(); for deleting the whole session.
And
"session_unset(); would delete only the variables from session - session still exists. Here Only data is truncated."
They both are better option.`

PHP Form Submit (save data into a text file) not working

So I do have a form on my web page and I would like to save user's input (email in my case) each time the Submit button is clicked.
HTML:
<form id="email-form" method="post">
<div class="form-group">
<input type="email" class="form-control" placeholder="ex: john#gmail.com" name="email" required>
</div>
<div class="form-group">
<input type="submit" class="cta animated-cta" name="submit" value="Continue">
</div>
</form>
PHP:
<?php
if(isset($_POST['submit'])) {
$email = $_POST['email'];
$file = fopen('list.txt', 'a');
fwrite($file, $email);
fclose($file);
}
?>
The problem is that nothing happens, while the code seems to be correct.
Things I've tried: Created myself the list.txt file (thought it doesn't get created automatically) | Put the script on my host to see if there's any difference (I coded it locally) | Added a PHP redirect to see if the code is executed once I click the button but isn't the case.
P.S: I do have a 'event.preventDefault();' in my javascript file which is executed once the Submit button is clicked (because I don't want the page to refresh once I click). Hovewer I've removed it but nothing changed.
Thank you in advance!

Submit form and redirect not working

EDIT: I should mention the form submits fine manually but with the javascript nothing seems to happen
I'm trying to get a form to autosubmit on page load and then redirect the user. Reason for this is this is part of a PHP page and the data needs to go into my database but then also POST the variables to a 3rd party SMS platform then return to the users dashboard.
My form looks like this:
<html>
<form action="https://www.example.com" id="myForm" method ="POST">
<input type="hidden" name="apiKey" value="withheld">
<input type="hidden" name="message" value="<?php echo $club_name ?> have requested you to play for them this weekend. Please login to your account to see more information and accept.">
<input type="hidden" name="to" value="<?php echo $to ?>">
<input type="hidden" name="from" value="withheld">
<input type="submit" name="submit" id="submit" value="Submit">
</form>
</html>
This seems to work fine so I assume the Javascript is incorrect which is:
<script>
document.getElementById('myForm').submit();
window.location.replace("https://www.example.com");
</script>
You have to use a different name than
name="submit"
as all name attributes are set as properties on the form,
hence overriding the default "submit" property on the form,
and the default form method "submit()" is gone.
https://developer.mozilla.org/de/docs/Web/API/HTMLFormElement
"Named inputs are added to their owner form instance as properties, and can overwrite native properties if they share the same name (eg a form with an input named action will have its action property return that input instead of the form's action HTML attribute)."
In your code window.location.replace("https://www.example.com"); line won't make sense because submit() function will try to submit the form and will change the page and then replace function will prevent submitting the form and will redirect the page. The right way to do this via js can be, submit the form via ajax and in the success callback of Ajax run document.getElementById('myForm').submit()

Make pre-populated PHP form submit on page load

I've got a working PHP form that I've built and it contains 5 fields which are pre-populated by a URL query string.
The query string URL is on a hyperlink on an HTML email asking the recipient to click here to make a booking. I've got their details already because I've sent them the email, hence why the form get pre-populated.
How can I get the form to instantly submit on page load and redirect to the thank you page?
Here's how my form looks at the moment:-
<form name="frm" id="frm" method="POST">
<input name="firstname" id="firstname" type="text" value="<?php echo ((isset($_GET["firstname"]))?htmlspecialchars($_GET["firstname"]):""); ?>" />
<input name="lastname" id="lastname" type="text" value="<?php echo ((isset($_GET["lastname"]))?htmlspecialchars($_GET["lastname"]):""); ?>" />
<input name="email" id="email" type="text" value="<?php echo ((isset($_GET["email"]))?htmlspecialchars($_GET["email"]):""); ?>" />
<input name="company" id="company" type="text" value="<?php echo ((isset($_GET["company"]))?htmlspecialchars($_GET["company"]):""); ?>" />
<input name="contactid" id="contactid" type="text" value="<?php echo ((isset($_GET["contactid"]))?htmlspecialchars($_GET["contactid"]):""); ?>" />
<input type="submit" name="Submit" value="submit" />
</form>
And here's the JavaScript I've tried (but didn't work):-
window.onload = function() {
setInterval(function(){
document.getElementById("frm").Submit();
},5000);
}
Here's a pastebin of the whole page: http://pastie.org/private/lgpealjya8xrwqi78gropw
Thanks
Alright so basicaly you have been trying to get information through url, insert them in a form and then submit the form so you can send an email. This is all quite nice although you're just making things harder than they are.
You you need to do is wipe off the form (we don't need this really) and instead of processing all those $_POST information you wanted to get off the form, you gonna do that with the $_GET array you already got off the url, at the end of the day it's exactly the same since the informations you're inserting in the form are only the ones you're getting off the url.
So if you change this the following way, youe script will work just fine :
//Get the submitted data
$firstname = cleanText($_GET['firstname']);
$lastname = cleanText($_GET['lastname']);
$email = cleanText($_GET['email']);
$company = cleanText($_GET['company']);
$contactid = cleanText($_POST['contactid']);
So here is what's gonna happen : the user is going to clic on a link, your script is going to get the $_GET array, process it, send the email based on this array, and this send the user to the thankyou.php page. Note that you could get your script to be more efficient and save the user some time if you insert your script in the thankyou.php.
Last but not least I would like to point out to you that it's not very good practice to get an email sent on url submission... you could end up having a bot send massive amounts of emails through this url and get you email blacklisted. If I were you I'd either control the ip and make sure only 1 mail is sent every 10 minutes or whatever time suits your needs best, or i'd add a captcha to the page so the user would need to show he's a human being who actualy wants to waste some time sending email.
try using: document.getElementById('frm').submit(); instead of document.getElementById('frm1').submit();
and also make it execute once the page has been loaded:
window.onload=function(){
document.getElementById('frm').submit();
}

Categories