Getting "Syntax Error: Unexpected Token" when calling a function from ajax

Question

I'm getting Syntax Errors when calling a php file with ajax.

Uncaught SyntaxError: Unexpected token F
Uncaught SyntaxError: Unexpected token F
Uncaught SyntaxError: Unexpected token F
Uncaught SyntaxError: Unexpected token F
Uncaught SyntaxError: Unexpected token F
Uncaught SyntaxError: Unexpected token F

The change_produkt function is called with an onclick event in a checkbox field. The output of this function is as following:

Return of change_produkt function

Now, I call the second function fill_optionen and pass the arrays to that function. It's doing ajax calls for each object. (6 times in this case)

Javascript:

function fill_optionen(optionen) {
     console.log("fill_optionen called.."); // Debug
     var text = "";

     $j.each(JSON.parse(optionen), function (index, value) {

        jQuery.ajax({
           url: 'include/mutation_helper.php',
           data: {func: "render_opt", option: value},
           type: 'post',
           success: function(output) {
              console.log(JSON.parse(output)); // Debug

           }
        });
     });
  }

function change_produkt() {
     console.log("change_produkt called.."); // Debug

     var id_produkt = $j("#produkt").val();
     console.log("DEBUG -- id_produkt:"+id_produkt);

     jQuery.ajax({
        url: 'include/mutation_helper.php',
        data: {func: "get_opts", produkt: id_produkt},
        type: 'post',
        success: function(output) {
           console.log(JSON.parse(output)); // Debug

           fill_optionen(output);
        }
     });
  }

PHP:

function render_opt() {
    if(!isset($_POST['option'])) {
      echo json_encode("error");
      exit;
    }

    $opt = $_POST['option'];

    $render = render($opt, $_SESSION['mutation']);

    echo json_encode("hello");
}

As soon as I remove the line which calls the render function, it works. But why is there an error? I'm not even printing out that $render variable. (The render function only returns html code in a string.)

As a side note, instead of calling multiple ajax requests in a loop, you'd have better to call only once with all values to pass and set logic server side — A. Wolff
– A. Wolff, Commented Jan 26, 2015 at 11:02
according to your code, this line $render = render($option, $_SESSION['mutation']); should be $render = render($opt, $_SESSION['mutation']); ? — Flakes
– Flakes, Commented Jan 26, 2015 at 11:03
@SearchAndResQ You're right. But the errors are still there. — Vince
– Vince, Commented Jan 26, 2015 at 12:02
If the error disappears as soon as you remove the render function call, but that function itself produces no output – then perhaps it/calling it is generating an error message/warning instead? Look at the actual response your AJAX call is getting in the network panel of your browser’s developer tools – what does that look like? — C3roe
– C3roe, Commented Jan 26, 2015 at 12:25
Of course you do, otherwise those messages are part of the response your AJAX request gets, and invalidate the JSON. — C3roe
– C3roe, Commented Jan 26, 2015 at 12:37

alpham8 · Accepted Answer · 2015-01-26 12:35:15Z

3

It seems that you have an PHP error inside your render function. And then PHP prints out its error, which later causes the JavaScript error. Because JSON is excepted as returned output by the ajax request and you got a string back containing the PHP error message. Please look at your browser debugger under the ajax request raw network data, what is really returned.

answered Jan 26, 2015 at 12:35

alpham8

1,3722 gold badges15 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vince Over a year ago

The render_option function called another function, which was not present. I did not know that there is a special response tab in the developer tools. Something else that I've learned :) Thank you.

Rory McCrossan · Accepted Answer · 2015-01-26 11:00:00Z

3

jQuery will automatically detect a JSON response and deserialise it for you. Calling JSON.parse on the resulting object will cause errors - as you've seen. Try this:

success: function(output) {
    console.log(output); // Debug
    fill_optionen(output);
}

answered Jan 26, 2015 at 11:00

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

1 Comment

Vince Over a year ago

But the errors are not caused by the console.log action. I tried it but the errors are still there. :(

Collectives™ on Stack Overflow

Getting "Syntax Error: Unexpected Token" when calling a function from ajax

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related