2

Below is jQuery code to pass form data to a php file. I'm using a very simple file just to test this. The jQuery code returns success and failure messages, but the failure message is the one that fires. It looks like the problem is in the php file, or in the data encoding.

This is the php file echo_test.php:

<?php
  $str = "Hello world!";
  echo $str;
?>

This is the jQuery code that sends html form data to the php file:

<form>
  <!-- form fields omitted for brevity -->
  <div class="btn_div">
    <button href="google.com" class="btn_joinnow" id="btn_submit"   style="color:rgb(255,255,255)">Click to submit data</button>
  </div>
</form>
$("#btn_submit").on("click", function(event) {
  event.preventDefault();
  var datastring = JSON.stringify({
    title: 'foo',
    body: 'bar',
    userId: 1
  });
  console.log("Okay, I'm starting");

  return $.ajax({
    type: "POST",
    url: "echo_test.php",
    data: { post: datastring },
    success: function (response) {
      console.log(response);
    },
    error: function (error) {
      console.log("Okay, I failed" + error);
    }
  });
});

(The data [ title: 'foo', body: 'bar', userId: 1 ] are just placeholders.)

The dev console reports: Okay, I failed[object Object] so it didn't work.

The dev console also says:

XML Parsing Error: no root element found Location: (file location) Line Number 4, Column 1:

Is the problem with jQuery or PHP?

Thanks for any ideas.

6
  • 1
    If it's going in to the error handler the error is with the PHP, however given how simple the example is it's hard to see where. It's most probably a configuration issue. Check the network tab of the dev tools after making the request to double check the exact status code and response text. Also check your server logs. Commented May 27, 2019 at 18:28
  • I am working on my local machine, not on my cloud server. Could that be the issue? Commented May 27, 2019 at 18:30
  • 1
    Do you have server setup on your local machine to handle PHP processing? An Apache server, for example. Commented May 27, 2019 at 18:31
  • No. That sounds like a possibility. I'm new to php. I didn't know it needs a server locally. I see that php has a local server php.net/manual/en/features.commandline.webserver.php. Commented May 27, 2019 at 18:32
  • 3
    It does, and that is the cause your problem then. The response is being returned as plain text, which jQuery is interpreting as XML (due to the leading <?), hence the error. If you're running windows, research how to setup an XAMPP server locally Commented May 27, 2019 at 18:34

2 Answers 2

2

You need an HTTP server that processes PHP code and answers with responses to HTTP requests. Your ajax request does not get the response correctly for some reason. That reason is url: "echo_test.php" which is the file probably with wring url. You will have to put the file in accessible URL (maybe your local machine) and request it. There are quick solutions like XAMPP for Windows, Linux or Mac that quickly installs HTTP server with PHP module for ready-to-use environment along with database management system as well.

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

Comments

0

The error means that expected response was XML but most likely it was empty. Try changing the "URL" for example to "/echo_test.php" and try opening this url via browser to see what's the content

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.