how to send single form value to multiple pages in php using jquery

Question

In PHP I am Working on when form has been submitted the values should send to different files Using jquery. example if demo.php form has been submitted data should sent to both process1.php as well as process2.php simultaneously but Its not showing any error and not able to get output. please help me through this code I have tried so far

Demo.php

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>main form</title>
    </head>
    <body>
    <form action="multi.php" method="post">
        Name:<input id ='myname'>
        <input type="button" id="btn" value="send to all">
    </form>

    <script
        src="https://code.jquery.com/jquery-1.12.4.min.js"
        integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
        crossorigin="anonymous"></script>
    <script type="text/javascript">
        $(function(){
            $('#btn').click(function(){
                var username = $('#myname').val();
                /*first post*/
                $.post('multi1.php',{name:username},function(result){
                    $('#display').append("<br>"+result);
                });
                $.post('multi2.php',{name:username},function(result){
                    $('#display').append("<br>"+result);
                });
            });
        });
    </script>
</body>

multi1.php

<?php
    echo "this is process1";
    echo"and you have posted:".$_POST['name'];
?>

multi2.php

<?php
    echo "this is process1";
    echo"and you have posted:".$_POST['name'];
?>

your browser console and error debuggers is your best friends with that ;) enable them and change the world! — hassan, Jan 10 '18 at 08:04
You're POSTing to `multi1.php` and `multi2.php`, but your files are named `process1.php` and `process2.php`. Could this be the problem? — brombeer, Jan 10 '18 at 08:05
I'll advice you use Ajax to make the POST request. you can just make two separate calls, one to `process1.php` and the other to `process2.php` — Ayo K, Jan 10 '18 at 08:10
sorry while I mentioning here, made a mistake but I have stored and mentioned correctly in program — Sowmya S, Jan 10 '18 at 08:37
@SowmyaS have you tried removing `action` and `method` attributes of form? — Suyog, Jan 10 '18 at 08:52

score 1 · Answer 1 · answered Jan 10 '18 at 09:00

Something like this:

let formID = $("uFormId");
formID.submit(function(event) {
     event.preventDefault(); // Stop to call URL

$.ajax({url: "multi1.php", data: formID.serialize() ,type: 'POST', success: function(data) { 
    console.log("Response from multi1 PHP: " + data); 
    //OR
    $('#display').innerText = data;
    }
$.ajax({url: "multi2.php", data: formID.serialize(),type: 'POST', success: function(data) {
    console.log("Response from multi2 PHP: " + data); 
    }
}

But, there are several art to make this event with javascript and you can finde a lot of them hier jQuery AJAX submit form

score 1 · Answer 2 · answered Jan 10 '18 at 09:16

The below code is working fine for me:

<!DOCTYPE html>
    <html>
    <head>
        <title>main form</title>
    </head>
    <body>
        <form>
            Name:<input id ='myname'>
            <input type="button" id="btn" value="send to all">
        </form>
        <div id="display"></div>

        <script
        src="https://code.jquery.com/jquery-1.12.4.min.js"
        integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
        crossorigin="anonymous"></script>
        <script>
            $(document).ready(function(){
                $('#btn').click(function(){
                    var username = $('#myname').val();
                    /*first post*/
                    $.post('multi1.php',{name:username},function(result){
                        $('#display').append("<br>"+result);
                    });

                    /*second post*/
                    $.post('multi2.php',{name:username},function(result){
                        $('#display').append("<br>"+result);
                    });
                });
            });
        </script>
    </body>
</html>

multi1.php:

<?php
    echo 'Posted on multi1.php - '.$_POST['name'];
?>

multi2.php:

<?php
    echo 'Posted on multi2.php - '.$_POST['name'];
?>

When I put 'test' in the textbox and hit 'send to all' button, the output I'm getting is:

Posted on multi1.php - test
Posted on multi2.php - test

for me only multi2.php is getting data .In console getting error as http://localhost/cms_05/multi1.php 404 (Not Found) .please let me know where I am doing wrong — Sowmya S, Jan 10 '18 at 09:23
If your multi2.php is getting data then multi1.php should also get it because the code is same for both, except the file name. Make sure you don't have any typo mistake there.. Also try following my code as I'm successfully getting data in both files. — Suyog, Jan 10 '18 at 09:26

score 0 · Accepted Answer · answered Jan 10 '18 at 08:17

Check the file names you are posting to and I assume that you are trying to access the posted variable from other php page without storing it.

In general, if you make an HTTP request (in your case, it is POST), the browser will send that value to the other page and will forget it and when you try to access the value from other pages (like, process1.php) it will return an empty string as it didn't store the variable.

So, a solution is to store the value in localstorage using javaScript and try accessing the variable from the other page.

here is the updated code

    $(function(){
      $('#btn').click(function(){
        var $username = $('#myname').val();
         window.localStorage.setItem('username', $username);
      });
    });

and get the stored value with

var $userName = window.localStorage.getItem('username')

you can know about it here and here

how to send single form value to multiple pages in php using jquery

3 Answers3