jQuery AJAX Call to PHP Script with String Return

Question

My aim here is to replicate the Hot Towel SPA framework from ASP.NET in PHP.

I have two files in my project: show.js and displaystring.php. What I basically want to do is return whatever is present in the displayString() function. But due to a series of unsuccessful attempts, I inserted the debugger statement in the shows.js file (as marked in the source code below) to find out what's wrong. When I run the project in Google Chrome and open the developer tools (Ctrl + Shift + i), I see that the program flow stops at the debugger statement (as expected) and when I hover my mouse over the data variable in the success property, I see that the displaystring.php file returns me the entire html source code instead of just returning the ".$_POST('string'); statement.

I have gone through many solutions on the internet but to no avail. Can anyone please tell me where exactly am I going wrong? Thank you.

show.js

define(function (require) {

    var val = "";
    //var moviesRepository = require("repositories/moviesRepository");

    $.ajax({
      url: "controllers/displaystring.php",
      type: "post",
      data: {input:"show"},
      datatype: 'json',
      success: function(data){
            val = data;      
        debugger; // Debugger inserted here.
      }});

    return {
        result: ko.observable(),

        activate: function() {
            this.result(val);
        }
    };
});

displaystring.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>String Display</title>
</head>

<body>
<?php
    function displayString() {
        return "The string passed is: ".$_POST('string');   
    }

    displayString();
?>
</body>
</html>

If you set $.ajax datatype as 'json' your response must be json encoded. @imRcH answer is the correct — vrunoa, Dec 16 '13 at 12:23
Okay so if I want to pass and display a string value, then what should the code be? — Razor, Dec 16 '13 at 13:27
I found the solution to the problem myself. I have posted the solution in the answers list. You can check it there. Thank you for help anyway. :-) — Razor, Dec 17 '13 at 06:53

score 2 · Answer 1 · answered Dec 16 '13 at 11:59

2

Try this way

displaystring.php :

<?php
    function displayString() {
        return "The string passed is: ".$_POST['input'];   
    }
    echo displayString();
?>

answered Dec 16 '13 at 11:59

Ankit Tyagi

2,381
10
19

RDK · Answer 2 · 2013-12-16T13:53:13.590

1

First of all you must specify headers:

header('Content-type: text/json');
header('Content-type: application/json');

Second you must to formmat your content for this kind of headers:

<?php
    function displayString() {
        return json_encode($_POST);   
    }

    echo displayString();
?>

And also you must to read official documentation:

You php file must be something like that:

<?php
     header('Content-type: text/json');
     function displayString() {
                return json_encode($_POST);   
            }

            echo displayString();

edited Dec 16 '13 at 13:53

answered Dec 16 '13 at 12:04

RDK

4,540
2
20
29

Thank you very much for replying. I tried your code but it's still not working. :( – Razor Dec 16 '13 at 12:37
try to use function displayString() { return json_encode($_POST); } – RDK Dec 16 '13 at 13:53
I have figured out the solution to my problem myself. I have marked my reply as the answer in the post. Thank you very much for your help. :) – Razor Dec 16 '13 at 15:16

Razor · Accepted Answer · 2013-12-16T15:35:52.170

Okay after banging my head against a stone wall for the whole day, I figured out the solution myself.

I just modified the code a bit to serve the purpose of finding the answer to my question.

show.js

define(function (require) { 
    return {
        result: ko.observable(),

        activate: function() {
            //var moviesRepository = require("repositories/moviesRepository");
            var self = this;
            $.ajax({
                url: "controllers/displaystring.php",
                type: "get",
                data: {input:"show"},
                dataType: "html",
                success: function(data){
                    self.result(data);
                    debugger;
                }});
        }
    };
});

displaystring.php

<?php
    function display() {
        echo 'Hi I am some random '.rand().' output from the server.';
    }
    display();
    //echo "Hello World!";
?>

And that's it! You don't have to type the entire HTML code for the PHP file. Just include the PHP script and you will get the output.

Thank you all very much for your help. :)

score 0 · Answer 4 · answered Dec 16 '13 at 12:04

0

Have only PHP script like @tyagi mentioned & change $_POST('string') to $_POST['string].

answered Dec 16 '13 at 12:04

Vijayakumar Selvaraj

523
4
16

Thank you very much for replying. I tried it by replacing the circular brackets with the square ones but unfortunately it still isn't working. – Razor Dec 16 '13 at 12:14

score 0 · Answer 5 · answered May 04 '14 at 15:37

0

Make Sure You didn't print the html in config file or constructor or something like that. I got the the same problem. Solution is to create separate file to handle the ajax request.

answered May 04 '14 at 15:37

Arslan Bilal

625
2
9
17

jQuery AJAX Call to PHP Script with String Return

5 Answers5