R3ter
R3ter

Reputation: 57

post in ajax with php get me undefined index

i want to send/pass data from the client to server by (ajax to php) but when i try this code

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
  $.ajax({  
    type: 'post',  
    url: 'loo.php', 
    data: { data: 'some data' },
    success: function(response,w) {
       console.log(w);
    }
});
    </script>
  <?php 
      echo $_POST['data'];
  ?>

in my browser i got success print out which mean that the javascript code is working fine i guess , by in php i got Undefined index p.s my file name is loo.php all the code is in the same file

edit: i have tried to separate my files like this:

my loo.php file:

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
$.ajax({
    type: 'post',
    url: 'test.php',
    data: {data: 'some data'},
    success: function (response, w) {
        console.log(w);
    }
});
</script>

my test.php file:

<?php echo $_POST['data']; ?>

still got undefined index

p.s. i navigate Manual to test.php file after i run loo.php file

Upvotes: 1

Views: 1446

Answers (5)

HSLM
HSLM

Reputation: 2012

Answer after you edit the question:

$_POST is the array sent by the HTTP Post request. so if the request to the page named test.php or whatever is not HTTP POST Request the $_POST array will be empty. but the $_GET array may have some data if you sent them. and navigation to a page is a get request to that page unless you used a form with method="post". so what you are doing with ajax call is correct. but navigating to test.php manually without a form with post method is not gonna fill the $_POST array. because when you make the Ajax call, it is done, it just makes the post-call correctly and everything is ok but when you navigate to that page it is a get request and it won't fill the $_POST array. to do so, you don't need ajax at all. you can have this form

<form method="POST" action="test.php">
    <input type="text" name="data" value="some data" />
    <input type="submit" value="submit" />
</form>

so either you use ajax and handle whatever you want to handle in the ajax success method. or use form and send the request to the page and handle it there.


the answer to the question before the edit

If they are in the same file it won't work like that, because when the file loads the $_POST['data'] is not exists at all, and after you run the ajax call, it exists within that call, not in your browser window.

so you can check if $_POST['data'] exists so you are sending it from ajax call so you can return it and use it inside your ajax success function.

conclusion:

you cannot put them in the same file and expect ajax will load before the actual php. it will first load the whole file then it will run the ajax. the undefined index is from the server before you even see the HTML page.

A solution could be:

File with your html and ajax functions index.html

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
  $.ajax({  
    type: 'post',  
    url: 'loo.php', 
    data: { data: 'some data' },
    success: function(response,w) {
       // use the response here
       console.log(w);
    }
});
</script>

and another with your logic loo.php

<?php
header("Content-Type: text/plain"); // if you want to return a plain text
// if you want to return json it could be header('Content-type: application/json');
echo isset($_POST['data'])? $_POST['data']: ''
?>

Upvotes: 0

Victor
Victor

Reputation: 5769

You get this error because when loading the page the POST request has not yet been sent. So show the submitted data only if it exists, otherwise, show the JavaScript code.

<?php
if (isset($_POST['data'])) {
    die($_POST['data']);
}
?>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
$.ajax({
    type: 'post',
    url: 'loo.php',
    data: {data: 'some data'},
    success: function (response, w) {
        console.log(w);
    }
});
</script>

Upvotes: 1

try to change the handler this way:

    if(isset($_POST['data'])){
        function return_data() {
            die(json_encode($_POST['data'])));
        }
        return_data();
    }

Upvotes: 0

VinothRaja
VinothRaja

Reputation: 1413

Try this

Html file

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="data_value"></div>

<script type="text/javascript">

$( document ).ready(function() {

    $.ajax({  
        type: 'post',  
        url: 'loo.php', 
        data: { data: 'some data' },
        success: function(response,w) {

          $("#data_value").html(response);
        }
    });

});

PHP file (loo.php)

<?php
print_r($_POST);
?>

Upvotes: 0

Chamidu Jayaruwan
Chamidu Jayaruwan

Reputation: 357

Try this.

<?php 
    $data = json_decode(file_get_contents('php://input'), true);
    echo $data['data'];
?>

Upvotes: 0

Related Questions