jQuery - How to post data to a different webpage and then display the results?

user_10435405 0
Viewed 61

How does one send POST data to a new webpage and then see the results of that webpage?

From checking here on stackoverflow, I found and tried the below code:

        $.post( 'https://192.168.1.1/newpage.php', { 'test_param' : filenames_string }, function() {
            window.location.href = 'https://192.168.1.1/newpage.php';
        });

And it works to get the data from the client browser to the server. But it then calls the page again to display the results, this time with no POST data being sent.

I have been able to use the following which does work:

        window.open('https://192.168.1.1?test_param={contents of the filename_string goes here}

But I would like to use POST instead because the list of items may not in the future be limited to just filenames and/or there may be thousands of filenames that could be sent.

The problem is that it gets the correct data in the POST, but when the page actually displays with the second line of code (windows.location) the data is missing. Or, more specifically, the POST data is missing and the results returned are, therefore, not the results of the original POST data. The second call (window.location) shows the results that are based on no POST data being sent. Fr It seems like just using the .post would work but I need to get a zip file of these items returned in a new browser tab with additional information displayed. So I need to go to a new page and also be able to send the POST data in one call. Is that possible?

Thank you for any solutions that may be suggested.

post jquery
2 Answers

I give this example for you as reference, the file is named test.php as a whole:

<?php
// 

if(isset($_POST["test_param"])) {
  echo "test_param=" . $_POST["test_param"] . " at " . time();
  exit; 
}
?>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $("button").on("click", function(evt) {
        var filenames_string = "My filenames string.";
        $.post(location.href, { 'test_param' : filenames_string }, function(data) {
            $("#result").html(data);
        });
        //
        // this is important:
        //
        return false;
      });
    });
  </script>
</head>

<body>

<form method="post">
    <button>Click me to send</button>
</form>

<div id="result"></div>

</body>
</html>

When you click on the button, jQuery posts a query to the current page, and the result content is displayed in the div id=result.

user_9530970

The title of the post is not accurate. I should have specified the overall action needed, which is beyond just displaying. Instead I needed open the new page called with the information from the POST being used to generate the webpage. But using the POST method alone only send the data. By the time the window.open is called to this same page, the POST data is gone. So in order to connect the two operations, I was able to achieve the results I needed by POSTing the data to the new webpage and then calling this webpage a second time with a GET using data returned by the page's processing of the POST data. Not perfect but its simple and works.

Basically, I send the list of filenames to zip and then return a the filename of the created zip file. I then call the page using this information in a GET param and the file is returned.

But as asked originally, it seems that there is no way to send the data via POST and also open a window at the same time...At least not the return of the created file in the same call. I was hoping there was a function similar to window.open where POST data could be appended. That way, the window.open would properly process the returned headers that contain the application/zip mime info.

user_104354050
Related