How to post form to two different pages with a sin

Question

I have a form with a single button like below:

<form name="sampleForm" id="sampleForm" method="post" action="" enctype="multipart/form-data">
<input type="text" id="biosample" name="biosample" class="sample"/>
<input type="text" id="library" name="library" class="sample"/>
<input type="submit" name="btnAdd" id="btnAdd" class="buttonsub" value="NEXT>>">
</form>

Ajax code is:

<script>
$(document).ready(function(){
    var encoded_project_id = $('#encoded_project_id').val();
    $('#sampleForm').on('submit', function(){
    var target = 'windowFormTarget';
    window.open('', target, 'width=500,height=300');
    this.setAttribute('target', target);
    $.post('postdata.php', $(this).serialize(), function(){
      window.location.href = 'phases.php?edit='+encoded_project_id;
    }).fail(function(){
    window.location.href = 'sample.php?edit='+encoded_project_id;
    });
  });
});
</script>

Now when button is clicked, I want to post the data from the above form in 2 pages - handler.php and postdata.php

Handler.php should open in a new javascript window and postdata.php should open in same tab and same window.

How it can be achieved?

Answer 1

you just to need two ajax call . Do something like this

$(document).ready(function(){
    // if want to stop default submission
    $("#sampleForm").submit(function(e){
    e.preventDefault();
    });

    $(document).on('click','#btnAdd',function(){
        send('page1.php',{'data1':'value'});
        send('page2.php',{'data1':'value'});
    });


});


function send(url,data)
{
    $.ajax({
        url: url,
        type: 'POST',
        datatype: 'json',
        data: data,
        success: function(data) {
            // success
        },

        error: function(data) {
            alert("There may an error on uploading. Try again later");
        },

    });


}

Answer 2

EDIT: It would seem you are using jQuery, so change this:

$(document).ready(function () {
    document.getElementById('sampleForm').onsubmit = function (e) {
        var req = new XMLHttpRequest();
        req.open('POST', 'test.php', true);
        req.send();
    }
});

to this:

$(document).ready(function(){
  $('#sampleForm').on('submit', function(){
    $.post('postdata.php', $(this).serialize(), function(){
      console.log('success');
    }).fail(function(){
      console.log('error');
    });
  });
});

---

You should do two things. First add

<form target="_blank" action="handler.php"></form>

This will ensure when the submit button is clicked that the form will open a new window.

Then you need to intercept the submit like so:

document.getElementById('sampleForm').onsubmit = function(e){
  //xmlHTTPRequest function
  //This is where you send your form to postdata.php
}

The code above will be called first and you can send your form with the asynchronous XMLHTTPRequest object to postdata.php . After that function ends, the default behavior of the form will start and your handler.php will receive the form.