So I am making a small quiz app that shows one question at a time, in order to move on to the next question you have to answer the current one correctly, and you have as many tries as it takes you...The quiz works perfectly. When you have answered the last question correctly, a form is displayed and it asks you to fill out some information so that the "quizzer" can send you a gift...The submission of this form is done via php, I did plan on implement JQuery/AJAX but right now I am just testing out the DB connectivity and other functions so i kept it simple...the problem I am having is that when I hit submit the page automatically gets refreshed showing the first question again and not outputting anything from my php script..I am not really sure what kind of code I could include to help anyone solve this, as I think it is a more theoretical problem, but let me know if you want me to post more...
Thanks in advance for any help, it is greatly appreciated!
<form action"/index.php" method="POST">
Congratulations! You passed! Please enter in your email address and we will send you something cool!<br />
<input type="text" name="email" /><br />
<input type="submit" name="submit" value="Submit" />
</form>
If the page submits and posts back to itself, the form is going to reset by design. You have to add code that detects the postback and if "True" then repopulate the form with the postback values to give the appearance of data persistance.
Havne't used PHP in a long time, but in .net you would detect a postback by calling:
....If IsPostBack Then....
When you do a postback, the entire page reloads, so that is going to fire your Javascript code again.
To avoid that, you should encapsulate just the form with AJAX to submit just the form so that the rest of the page doesn't post back (including the javascript).
Hope this gives you some direction.
Or... you can change
to post to a different file (like /index2.php) and that way you don't have to worry about postbacks or stuff like that.
Did you check the post data on the same index.php page, like doing:
if(isset($_POST) AND !empty($_POST)) {
var_dump($_POST);
}
This might help you in some way.
I am having the same issue, but with jQuery Mobile. I have implemented this on the form submit but all I need to do refresh the query results:
onClick="window.location.reload(true)"
This is basically a page refresh more than anything but might point you on the direction you need as well.
Related
This isn't so much a programming question so much as me just trying to wrap my head around whats going on behind the scenes.
When a user submits content via a php form what exactly happens?
I'm trying to understand how exactly submission data from a form gets saved so that its their for others to see. Take reddit (or even this site) for example, users fill out a form hit submit and their post is there for everyone to see forever. Does this happen no matter what? or is there more code that needs to be added. If it does happen automatically, is the data lost if the server goes offline? how is that data deleted? etc etc
Thanks for the help in advance
EDIT: I guess a better question is how exactly does POST work.
This is a POST example. Please try to find a tutorial to learn PHP.
<form method="POST">
<input type="text" name="yourName">
<input type="submit" value="Submit your name">
</form>
<?php
// This is a PHP comment
// We check if the POST is made
if(isset($_POST['yourName'])){
// We store the POST-variable in a usual variable
$variableWithName = $_POST['yourName'];
// Print out the name
echo "Your name is ".$variableWithName;
}
I know this type of question is asked a lot, I've seen quite a few, but none of them seem to answer what I am trying to do, even enough to get me started. I have very little understanding of jQuery, I haven't quite picked it all up (got PHP, though). I want to onclick() of my element as shown below:
<form name="cleartask1" method="POST">
<input type="hidden" name="taskid" value="1">
<input type="checkbox" class='icheck-me' name="check1" data-skin="square" data-color="blue">
</form>
Submit data to a file, we'll say, for this example post.php, but I need it to send the value of all of the form elements when checked (the default for a checkbox) to the post.php file. The post.php file will then pull the data from what was posted from the form. Would I call it in a way as below?
<?php
$value = $_POST['taskid'];
?>
How would I post that to the post.php file? If this doesn't make sense please tell me and I will definitely explain in greater detail. Pretty much I want to post form data on the click of a check box for that specific form.
Notice: The form name and checkbox name are the same to group them together, these tasks will be listed from a MySQL database so grouping them ensures that I submit to the correct one.
Please let me know if you can help, or if you need further information.
UPDATE: I do need to submit this without reloading as this is a live task list, so submitting this without reloading would be best. If it's possible could someone provide an example of jQuery's Ajax to use in order to complete this?
Thanks,
Scott
do you mean something like this? you can use jQuery.submit()
$(".icheck-me").click(function(){
$("form[name='cleartask1']").submit();
});
http://api.jquery.com/submit/
How do I submit the form to another page without reloading, though?
That probably would of made more sense to ask. :) Sorry
as you want to make a post without reloading the page you need to use AJAX
http://en.wikipedia.org/wiki/Ajax_(programming)
and Jquery has a simple way for doing AJAX Request
it would be something like this
$(".icheck-me").click(function(){
$.ajax({
type: "POST",
url: "<address to your page where you want to send your data>",
data: { taskid: $("input[type='taskid']").val()
}
success:function(rsp){
//do anything you want after a successful ajax request
}
});
});
http://api.jquery.com/jQuery.ajax/
Well we want to help you that much but please have a time to study something about ajax first and the the ajax things in jquery.. then if you have find some difficulties of understanding it then ask here again and post what you have done so far =)
I have a webpage that contains a form, and i need to refresh the page right before the form is submitted. Is there a way to have the Submit button refresh the current page and then submit the form to the proper php document?
I am using a general form with the submit button looking like
<input name="Submit" value="Submit" type="submit" />
Fix the page - do not pursue making this problem larger than it already is. I think it's some tunnel vision, you've made some mistakes on how you have setup your form or page, and now you are trying to continue down the wrong path instead of correcting your original problem.
Refreshing the page to submit some javascript data and then submit the form etc... is incorrect and needs to be fixed.
Best of luck and happy coding!
You can give the form a target to submit it in a new window and bind an event handler to it that refreshes the page on submit.
Please clarify what exactly you're trying to achieve. If you're trying to get some data from the server that's required to submit the form, it's possible to do (though it's not the best way to handle it). You'll need to intercept form submit, stop the events, perform an AJAX request to the server and then submit the form from code.
I've looked around for an answer to this problem, and I'm slowly accepting the fact that I've probably gone about things the wrong way, but here's a request for some wonderful pearl of wisdom that might help!
I'm working on a website which has a directory-style navigation bar on the left. So at first the user will only see two directories (Grammar / vocabulary - it's an English learning site) and by clicking on the directory, it will "open" to reveal its contents (other pages or directories).
The way I have this working is that each directory is a form submit button that reloads the page when clicked, but with a value in $_POST that tells the site to open or close a folder (this is done within an array in $_SESSION). It works great! The issue, though, is that if a user clicks the back button in their browser, they get the prompt asking if they wish to resubmit data, which is not something I want.
I was wondering if there was a way I can detect in php if the back button has been pressed, so that instead of reloading the page and making changes to the side bar, the side bar will remain the same and instead the user gets taken to the last page they had visited.
I'm aware that the real solution to this is probably just to rethink the side bar, and any advice on a better way to do that would be much appreciated also!
Michael
The reason you're getting the prompt is because POST is supposed to be used if the data being sent is going to modify something, so submitting a POST request using the back button might have unexpected behaviour (like duplicate data).
Replacing POST with GET should disable the prompt.
HTML
From:
<form action="page.php" method="post">
</form>
To:
<form action="page.php" method="get">
</form>
PHP
Change references from $_POST[''] to $_GET['']
DEMO: http://aseptik.net/php5/demo/deal-with-undesirable-behaviour-when-clicking-the-back-button-on-my-website
<?php
session_start();
if( $_GET['t'] == $_SESSION['token'] || $_SESSION['directory'] == $_GET['q'] || !isset($_GET['q']) ) {
echo "<h1><span>you going</span> forward</h1>";
} else {
echo "<h1><span>you going</span> backward</h1>";
echo "<p>should be <strong>{$_SESSION['directory']}</strong> directory</p>";
}
$token = uniqid();
$_SESSION['token'] = $token;
$_SESSION['directory'] = $_GET['q'];
?>
grammar
vocabulary
Back button re-submit form data ($_POST)
Prevent Back button from showing POST confirmation alert
As a general rule in web development you should only do a post when you are submitting data that you don't want to be resubmitted, or that you don't want to show up in your logs on the server. And once you do a post, you should redirect using get parameters or some other method.
If you use get parameters instead of post then you can just make the page navigation stateless and just fetch the page they ask for.
There are methods for detecting if the back button has been pressed, but they are difficult to make work consistently, and can be frustrating to the user, so it is recommended you go about it another way.
I'm having problems submitting my ajax form. I am used to the old fashioned way with refresh but this new stuff is beyond me for the time being. It's time to start learning new technolohies.
I have an autosuggest box that is getting my results from a database and populating the textbox just fine. When I designed this about 6 months ago, I was searching the database on the value rather than the key value. This is a problem today and needs to be fixed.
WHat the ajax has returned to my script is the key/value pair. Now that I have the id, I need to pass that into my php method so I can process it from there.
Can somone please give me a hand with this? It seems simple enough but again, javascript was never my thing so I am lost.
Here is all of the relevant code. Also, I don't think, at least from the code samples I have seen so far that I even need a form tag. Am I correct on this? Ideally, I want to submit the found ajax value with the enter button and NOT using a button.
So, just to clarify, this is what happens. The user types 2 or 3 letters. The ajax queries the db on a "LIKE" operator and returns the matches. The user chooses the one he wants and then the id goes out to my method and returns the exact record in a different window.
<form method="post" class="hdrForm" id="search" action="../../index.php?cer=2" target="_top">
<input type="text" name="string" class="hdrInput" id="string" value="Quick Search"><div id="acDiv"></div>
</form>
Note.. I need the "id" in this function to be submitted. Right now, I am getting the POST val off the form tag and that's not correct but how?
AC.chooseFunc = function(id,label)
{
document.forms.search.submit();
}
Thanks for any help that you guys can give me on this.
Take a look at jQuery. It is a javascript library. It contains functionality for doing Ajax.
jQuery Ajax documentation.
document.getElementById("search").onsubmit = function() {
// Do what you want with the form
return false; // Stops submit continuing
}
This also degrades gracefully (if your server side program is written right) in that users without javascript get the form submitted normally to the page in the action attribute, without the AJAX.
I'd suggest you use a framework such as jQuery. A basic tutorial (including AJAX) is available
You have two problems. One is that you are telling the form to submit:
document.forms.search.submit();
That is what is causing your form to submit in the standard, non-xhr way - causing a refresh. Also, because your form does not contain an input element for the id, that is not being sent to the server even with a regular form submission.
I agree with the posters that it would be a good idea to use jQuery or something to do your ajax based submission. Something like this could be used inside of your "AC.chooseFunc" function instead of the form submit.
And yes, if you go ajax entirely, you don't even need a form tag.