Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite
1

Today I tried Ajax with the below code. Logic seems to be correct because success function is triggering but i can't able to get return value from php file, instead i'm getting Javascript and html code when i alert the response.

example1.php

 <?php
    echo $_POST['name'];
 ?>
<form action="?" method="post">
<input type="text" id="d1" name="name" value="">
<input type="text" id="d2" name="place" value="">
<input id="target" type="submit" name="submit" value="send">
</form> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#target").click(function()
{
var data1=$("#d1").val();
var data2=$("#d2").val();
$.ajax
({
type:"POST",
url:"example1.php",
data:{name:data1,place:data2},
success:function(msg)
{
alert(msg);
}
});
return false;
});
});
</script>

When i run the example1.php it shows the alert message like given below Submitted name

<form action="?" method="post">
<input type="text" id="d1" name="name" value="">
<input type="text" id="d2" name="place" value="">
<input id="target" type="submit" name="submit" value="send">
</form> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#target").click(function()
{
var data1=$("#d1").val();
var data2=$("#d2").val();
$.ajax
({
type:"POST",
url:"arithmetic.php",
data:{name:data1,place:data2},
success:function(msg)
{
alert(msg);
}
});
return false;
});
});
</script>

Why am i getting this instead of name and place value from example1.php?

share|improve this question
 
Why did you edit your question with <form action="?"? The operative character being >> ? << - you should explain the "why". –  Fred -ii- Jul 24 at 13:51
 
After your edit, the question became confusing... How many php files you're talking about now? And what "name and place value from example1.php"? You removed all php code... Could you please clarify? –  bfavaretto Jul 24 at 13:52
 
@bfavaretto only one file. now i added php code in it. i can get value but along with the client side whole code –  sun Jul 24 at 13:56
 
@Fred i used ? to submit value to the same page –  sun Jul 24 at 13:58
 
@bfavaretto thanks for your extra bit of information to use submit function. it is helpful –  sun Jul 24 at 14:00
show 1 more comments

3 Answers

up vote 4 down vote accepted

UPDATE considering that the question changed

You're posting to the same file where the form is, so your response includes the HTML code in that page. You have to post to a different PHP file that only responds with the content you want, or change your current file to respond differently if some data was posted.

Your ajax request is not going to response.php, because you told jQuery to post to a different URL:

url:"arithmetic.php",

Change that to response.php.

To guarantee you always post with ajax, you should bind to the form's submit event, instead of the submit button click:

$('form').submit(function(e) {

    // ajax stuff

    // prevent default (submit)
    return false;
});

With your current code, the form will submit without ajax if you hit enter while focused on one of those input fields.

share|improve this answer
 
Seems right, although it doesn't explain why the alert is showing the entire contents of the example1.php page. –  Barmar Jul 24 at 13:40
 
I for one am curious. Does the action still need to be <form action="response.php" method="post"> or can that be left blank, since it's inside the Ajax? –  Fred -ii- Jul 24 at 13:41
 
@Barmar I guess example1.php was just an example, and in the actual code it's arithmetic.php –  bfavaretto Jul 24 at 13:41
 
agree with this answer, just want to add a little improvement. Instead write response code as follows <?php if(isset($_POST['name'])) {echo $_POST['name']; echo $_POST['place']; exit(0); } ?> –  Taimur Khan Jul 24 at 13:42
 
@Fred Yes, if you leave it blank it will assume it should post to the current page. You should take an extra precaution to guarantee you always post with ajax, I'll update the answer. –  bfavaretto Jul 24 at 13:42
show 12 more comments
up vote 1 down vote

Change your response code as follows. You need to stop execution after writing your response. 

<?php 
if(isset($_POST['name'])) {
echo $_POST['name']; 
echo $_POST['place']; 
exit(0); 
} 
?>
share|improve this answer
up vote 0 down vote

chage the url to url:"response.php"

and write the code in responce.php like this

$name=$_POST["name"];
$place=$_POST["place"];
share|improve this answer
 
You mean like bfavaretto's answer over 10 minutes ago? –  Barmar Jul 24 at 13:49
 
Both answers seem to not apply anymore, now that the OP edited the question... –  bfavaretto Jul 24 at 13:50
1  
@bfavaretto Seems like the "plot thickens", "as it were". –  Fred -ii- Jul 24 at 13:52

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.