Question 421607 in PHP Question posted in
Official manual can be found here.

Php – Javascript AJAX request with 2 different return types

Is it possible to return 2 different types by an AJAX request?
I created a form with method post. The PHP file creates a PDF file what is returned to the JavaScript file and is automatically downloaded.

But I want also return an array to the same JavaScript file with messages like errors or a notice.

Can I do this in one call or is there a second call needed?

var form = event.target;
var formData = new FormData(form);
fetch(url,{
    method: 'post',
    body: formData
}).then(response => response.blob()).then(response => {
    const blob = new Blob([response], {type: 'application/pdf'});
    const downloadUrl = URL.createObjectURL(blob);
    const a = document.createElement("a");
    a.href = downloadUrl;
    a.download = formData.getAll("invoicenumber")+".pdf";
    document.body.appendChild(a);
    a.click();
});

PHP

$createPdf = new CreatePdf;
$response['msg'] = 'PDF is created!';
header('Content-Type: application/json; charset=UTF-8');
echo json_encode($response);
Tags:

2

Answers


  1. 0

    Is it possible to return 2 different types by an AJAX request?

    Yes two and even more. The HTTP protocol offers a mechanism to communicate back to fetch() what the actual content-type (and length) of the response is.

    Then again, if you make use of JSON Text — as your question shows — you can make PHP return a JSON array with zero, one, two or even more types.

    Response Web API

    Other forms of multipart messages are possible, too! You’d have to do the decoding on the binary arrays thought IIRC.

    Additionally, you can signal diagnostic information and raise errors on the HTTP status code protocol already.

    Login or Signup to reply.
  2. 0

    It is possible but not very practical.
    You can send multipart/form-data from your server in the response and use the fetch API to read the response.
    There is no built in way to send a multipart/form-data in a response by php so you’d have to code your own or look for a library built by someone.

    var form = event.target;
var formData = new FormData(form);
fetch(url,{
    method: 'post',
    body: formData
}).then(response => response.formdata()).then(response => {
    const blob = response.get('file');
    const downloadUrl = URL.createObjectURL(blob);
    const a = document.createElement("a");
    a.href = downloadUrl;
    a.download = formData.getAll("invoicenumber")+".pdf";
    document.body.appendChild(a);
    a.click();
    var data = JSON.parse(response.get('msgs'));
    console.log(data[0].arrayData);
});

    I think the easiest way to go is to just save the file on the server and send the file name back in the response with the other data.

    var form = event.target;
var formData = new FormData(form);
fetch(url,{
    method: 'post',
    body: formData
}).then(response => response.json()).then(response => {
    console.log(response.arrayData);
    window.location = response.fileUrl;
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search