I want to send the data and the Text that is in one DIV tag with Javascript into php values.
I have problem with using this code :
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
<script>
$.post('http://localhost/test/index.php', {
name: $('.class').html()});
$(document).ready(function(){
$("#my_form").on("submit", function () {
var hvalue = $('.class').text();
$(this).append("<input type='hidden' name='name' value=' " + hvalue + " '/>");
});
});
</script>
<form action="" method="POST" id="my_form">
<div class="class" name="name">
this is my div
</div>
<input type="submit" value="submit" name="submit" />
</form>
<?php
if (isset($_POST['name'])) {
echo $_POST['name'];
}
It doesn't work . Nothing appear ! and NO php working !
How can i solve this problem ?
-
3Use debugger. For example the one in Chrome, or Opera. It contains nifty 'Network' tab, that displays all ongoing communication. You can see if the callback was done, and what was returned.nothrow– nothrow2014年02月09日 13:05:55 +00:00Commented Feb 9, 2014 at 13:05
-
2your script already tries to initiate a post request while loading the page. At least wait till the page has finished loading before doing that. Right now you're sending the post request, and including a value from your DOM that does not even exist yet.Tularis– Tularis2014年02月09日 13:07:25 +00:00Commented Feb 9, 2014 at 13:07
-
1This script needs serious refactoring, as it's not going to do the intended action even if your PHP was setup correctly. I'll try to fix this in my answer.Zarathuztra– Zarathuztra2014年02月09日 13:08:01 +00:00Commented Feb 9, 2014 at 13:08
-
@Zarathuztra The php is ok . thanks for your answer.user3271403– user32714032014年02月09日 13:10:21 +00:00Commented Feb 9, 2014 at 13:10
-
1It doesn't matter if "the loading ends soon". Your posting code is executed immediately when it is loaded. Since it is loaded before your DOM has finished loading, your post request will fail. You NEED to delay the execution until after the loading has finished.Tularis– Tularis2014年02月09日 13:13:46 +00:00Commented Feb 9, 2014 at 13:13
2 Answers 2
You have stated you would like to do the following:
I want to send the data and the Text that is in one DIV tag with Javascript into php values.
And
It doesn't work . Nothing appear ! and NO php working !
First you need to decide on what "appear" means. Are you trying to take the results of the PHP script and embed them on the page?
First, let's focus on your first item, sending the data. Please do the following:
Remove the onReady statements from inside the post request you're making. This is confusing and could result in unexpected results:
$.post('http://localhost/test/index.php', {
name: $('.class').html()});
$(document).ready(function(){
$("#my_form").on("submit", function () {
var hvalue = $('.class').text();
$(this).append("<input type='hidden' name='name' value=' " + hvalue + " '/>");
});
});
Readability is key here. This is absolutely bizarre looking and I've never seen anyone do it this way.
Notice I changed your class from .html() to .text(). This is because you're only working with a text node and not html at this point given your example code. If it were actually html, then you could use the html() function.
Second, the PHP script you're trying to hit is embedded directly. Try moving it to a new file, such as in my above example myPhpScript.php
Inside that file would be your PHP code that fields the post request:
<?php
if (isset($_POST['name'])) {
echo $_POST['name'];
You're missing an on success handler in your POST request, so when the request success, nothing is going to happen. Please add the following to your request setup object. AT this point you can do the following with your on ready as well
$(document).ready(function(){
$.post('http://localhost/test/myPhpScript.php', {
name: $('.class').html()}
,function(data){
$(".class").text(data).append("<input type='hidden' name='name' value=' " + hvalue + " '/>");
}
});
});
This should get you started, but keep in mind there could be other issues as well. I've got my own share of issues in here as well. I'm going to blame lack of caffeine and a toddler, plus not keeping the documentation open long enough to make sure I get it perfect :).
Someone was kind enough to edit my mistakes, so for that I thank you.
2 Comments
That is because you didn't specify a success handler for your $.post request. So all it does is return some HTML like you have in the background, but your JavaScript isn't doing anything with it.
Please read the API docs on http://api.jquery.com/jquery.post/ and check the success(data, textStatus, jqXHR) part of the arguments to $.post. That is where you define your success handler.
Try this and you'll see what I mean:
$.post('http://localhost/test/index.php', {
name: $('.class').html()
}, function(data) {
alert(data);
});
Within the function(data) { ... } you need to program some logic so it does something with your data.