JavaScript value not being received by PHP

Question

I am having trouble with a program that I have written. The idea is that I click a link and the value of the link is picked up in a JavaScript variable. I then do a GET request to send the value to a PHP variable and print it out.

Here is the code:

The HTML

<html>
    <head>
        <script src= "http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    </head>
    <body>
        <div id='mydiv'>
            <a href='/codeigniter/index.php/hashtest/hi'>Link 1</a>
            <a href='/codeigniter/index.php/hashtest/hi'>Link 2</a>
        </div>
    </body>
</html>

The jQuery (in a <script> tag within the above body)

$(function()
{
    var mydiv = $('#mydiv');
    mydiv.on('click', 'a', function(){
        var text = $(this).text();
        console.log(text);
        //$.get("hashtest.php", {qwerty: text});
        $.ajax
        ({
            url: "/codeigniter/index.php/hashtest/hi",
            data: {
                qwerty : text
            },
            async: "false",
            success: function(data){
                console.log("success!");
            },
            error: function(jqXHR, status, error)
            {

                alert("Status : " + status + " error: " + error); 
            }   
        });
    });
});

The PHP

class Hashtest extends CI_Controller {

    function __construct() {
        parent::__construct();
    }

    public function hi() {
        $x = $this->input->get('qwerty');
        print $x;
        print "";
    }

}

The error:

NS_ERROR_NOT_AVAILABLE: prompt aborted by user

At the moment, the JavaScript correctly gets the right link value as the console.log() line outputs the right thing for both links. But it seems the PHP is not receiving this value because nothing is being printed out. I've tried replacing the variable with a hard-coded string but it makes no difference. I can print static PHP from within the method above so I don't think it's an issue where I can't print any PHP at all.

A few points:

I used $.ajax instead of $.get just to see what error message would appear (ideally I'd want to use $.get though). It seems it's some sort of uncaught exception based on what I've read about the above error message and the fact that the alert box that appears doesn't show an error message, just a status of "error".
I don't expect any value back, the success method is just there to see if the request is wokring or not (which it currently isn't)
I am assuming that the id of the link is unknown.
The code is all within the same class and the URL that I'm pointing to in the AJAX request is correct (I got a HTTP 200 code back in my browser console).
The PHP was written using the CodeIgniter framework.

score 3 · Accepted Answer · answered Dec 26 '13 at 16:16

3

You need to prevent the default action of following the link:

$(function()
  {
      var mydiv = $('#mydiv');
      mydiv.on('click', 'a', function(e){
          e.preventDefault(); // <-- THIS IS NEEDED
          var text = $(this).text();
          console.log(text);
          //$.get("hashtest.php", {qwerty: text});
          $.ajax
          ({
              url: "/codeigniter/index.php/hashtest/hi",
              data: {qwerty : text},
              async: "false",
              success: function(data){
                  console.log("success!");
              },
              error: function(jqXHR, status, error)
              {

                  alert("Status : " + status + " error: " + error); 
              } 
          });
      });
  });

answered Dec 26 '13 at 16:16

Barmar

741,623
53
500
612

Adding that in removes the error and the code passes through the "success" method rather than the "error" method but the PHP still won't print. – user1849060 Dec 26 '13 at 16:27
Where do you expect it to print? The output of the PHP is in `data`, and you're not doing anything with it. – Barmar Dec 26 '13 at 16:42
OK for some odd reason `data` contains all the HTML, jQuery and PHP. The $x variable does now contain the right value but it still isn't displaying on the browser when I try to print it out. – user1849060 Dec 26 '13 at 16:58
It won't display in the browser unless you put it there, e.g. `$("#somediv").text(data)`. – Barmar Dec 26 '13 at 17:00
Drat! You're right. Forgot that the print statement is just there to return something to the JavaScript. Still doesn't explain why data contains all the HTML, jQuery and PHP though. That natually gets outputted to the browser when I use the `text()` method. – user1849060 Dec 26 '13 at 17:04
Did you put ` – Barmar Dec 26 '13 at 17:08
I've used ` – user1849060 Dec 26 '13 at 17:14
If you call `header()`, `setcookie()`, or `session_start()`, make sure you do it before you output anything. – Barmar Dec 26 '13 at 17:20
I'm not doing any of that though - no cookies or sessions at all. – user1849060 Dec 26 '13 at 17:52
Nothing, not even a comment. – user1849060 Dec 26 '13 at 17:53
Make sure you're reading the error correctly. I'm not talking about line 308. The rest of the message should say "in /path/to/file.php on line XXX", XXX is the relevant line. See http://stackoverflow.com/questions/8028957/headers-already-sent-by-php/8028987#8028987 – Barmar Dec 26 '13 at 17:57
That's the line I mentioned - the last line of the script which just has a HTML comment `
-->` (there was whitespace below initially (which is why I said there was nothing at all first) but I removed it)
– user1849060 Dec 26 '13 at 18:03
Maybe you're using a library that sends headers, you need to initialize the library before you get to line 308 of the script. – Barmar Dec 26 '13 at 18:08
I'm not using any libraries except for calling the jQuery CDN. In the PHP I use $this->input->get() but that doesn't need the initialisation of a library, just to call the constructor of the parent controller class (which I have done) – user1849060 Dec 26 '13 at 18:30
PHP doesn't just make up things like this. If you want help with that error, post a new question with more details. – Barmar Dec 26 '13 at 18:32

score 0 · Answer 2 · answered Dec 26 '13 at 16:22

Your code is correct, but your not stopping the event when you click on the link.

Add e.preventDefault();

var mydiv = $('#mydiv');

            mydiv.on('click', 'a', function(e){
                      e.preventDefault();
                      var text = $(this).text();

      </code>

JavaScript value not being received by PHP

2 Answers2