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 =)
Related
I know that there are many others question about this topic but unfortunatly (my knowledge are too low in AJAX and PHP) I didn't get how to make it work. So please excuse me if this question is redundant or already done, but I need some more "pratical" explanation to understand the issue better.
So here the topic:
I have a game where all of the player have their character sheets
hosted in a site.
The Character's Sheets are made by several <input> tag and the
players just fill them in. So, for example my Strenght score is
inside an input and so on.
I'm storing all of this data inside a Database
from what I've learned so far I can only "save" the data by "Posting" it and refreshing the page.
My Question Is it possibile to "update" the database when blurring from an input to another (whith "onBlur") without exiting the page?
So for example here I have an example input:
<input name="spell_school" type="text" class="i50xauto"
placeholder="School"
value="<?php echo $row_rs_npc_erky_school['spell_school']; ?>">
I have to add some onBlur function?
Thanks for the help
You'll probably need a player ID or similar on the page, perhaps in a hidden field?
You can then make the ajax call
$(".i50xauto").blur(function() {
$.ajax({
url: 'path/to/saveToDB.php',
type: 'POST',
data: {
player_id: $("#player_id").val(),
spell_school: $(this).val()
}
});
});
Then inside the PHP file (lets call it saveToDB.php), you can update the database as you normally would, accessing the passed data via POST variables:
$_POST['spell_school']
$_POST['player_id']
I am creating a button as such
<INPUT type='submit' name='name-of-button' value='Submit'>
However, this button is NOT enclused in a FORM. In other words, there isn't any form to submit.
That said, when a user clicks on the button, a certain action should start in PHP. For the sake of an example, clicking on Submit will write a value to the database.
Now, I am not sure how to handle the code in PHP. Do I have to put a form around it? I would like to check using something simlar to following PHP?
if (isset('name-of-button')) {
// Do something, such as writing to the db
}
I know the above code is incorrect. Because we have to submit the form, and use the post action as follows:
if (isset($_POST['name-of-button'])) {
// Do something, such as writing to the db
}
But again, I do not like to use a form if possible. PLEASE HELP :)
Please not that I do not want to use JavaScript either, pure PHP.
Thanks.
You can't make a browser send data to the server with only PHP and a HTML button. You have to make either a link that looks like a button, use JavaScript (AJAX), or enclose the button in a form.
OK, thanks everyone for your replies.
Just to make sure the post is complete and to help others:
As stated by some of your answers, to call a PHP function, I must either use form submit, use AJAX, or use a link. Therefore, for me, I will choose the easiest solution, which is use a form.
That said, according to the standard in HTML, you can use INPUT tags without a form. I think that was done so as to handle AJAX cases where you do not need a form. I was trying to find a way of doing the same straight to PHP, without a form, and without AJAX. It oviously does not work.
Thanks.
Firstly, let me say that I've been searching the Internet, rewriting scripts and I still can't seem to find a solution to my problem or even one that could possibly help. I've even searched this site for similar questions and the focus seems to be on actually displaying the database values but what I want is to access those values. Or rather let me put it like this, I have a drop down that is generated through php and it contains data retrieved from mysql... all that works fine no errors.
My current problem is that when a user select an option from my dropdown, I want to use that value to do more operations based on the user's selection. Please help, I've been at it for a week with no avail. Thanks in advance. If you need samples of my code please tell me.
Your problem is not that easy since php only runs on the server and does not directly get any information about what a user is clicking and selecting in his browser.
One possible solution (and the most common one nowadays) is to load any further information asynchronously via AJAX as soon as the user selects something in your dropdown. jQuery is a neat framework that can help you with this.
An other method is to automatically submit the form as soon as something is selected and read the selected value with php ($_POST variable). With this you could then easily generate a more custom website according to the selection that was made. Code could look like this:
<form method="post" action="" name="myform">
<select name="myfield" onchange="this.form.submit()">
<option .... >
...
</select>
</form>
(Note that the form is submitted when the onchange event is triggered)
This method clearly has the disadvantage that the whole page has to be reloaded whenever a selection is made. With the AJAX approach the user does not even notice that some additional information was fetched form the server. (Except a small waiting time that may occur)
What you want to do depends on your own decisioin. However the first approach may need you to get into some javascript programming. But the result is certainly more comfortable for the user...
You could make a callback function on the onselect Event. This is the easiest with jQuery in my experience.
http://api.jquery.com/select/
Wrap your select in a form which had a post of type 'get'. This will post to the same page you are in and then you can use the get parameter on page refresh to load your second list
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.
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.