submitting multiple forms with one button for both php and javascript

Question

Is it possible to submit two forms with one button? One form's values are generated from JavaScript and the other form from PHP.

I made an example to give an idea of what I'm attempting.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

<?php
Class testing{

    function text_test(){
        ?>
        <form method="post" name="postform">
        <input type="textbox" name="text"/>
        <input type="submit" onclick ="submit_form()" name="submit"/>
        </form>
        <?php
    }

    function display(){
        echo $_POST['text'];
        echo $_POST['js_input'];
     }
 }
$test = new testing();
$test->text_test();

if(isset($_POST['js_form'])){
    $test->display();
}
?>

<script type="text/javascript">
    var jsvariable = "js_test";
</script>

<form method="post" name="js_form">
<input type="hidden" name="js_input"    value="document.getElementByName(jsvariable).value" />
</form>

<script type="text/javascript">
function submit_form(){
    $('postform').each(function () {
            $(this).ajaxForm();  //Initialize as ajaxForm
            var options = {
               context: this
            }                 
            $(this).ajaxSubmit(options); //Submit form with options above
    });
    $('js_form').each(function () {
        $(this).ajaxForm();  //Initialize as ajaxForm
        var options = {
           context: this
        }                 
        $(this).ajaxSubmit(options); //Submit form with options above
     });
 }
 </script>

Answer 1

I don't believe its possible to do two consecutive submit() calls, because invoking submit() means that you are making an HTTP request (GET, POST, etc..) and that the server will forward your page somewhere else. This means that the second submit() will never be reached.

It might be better to send a blocking asynchronous POST/GET call and after that call a submit() or even a second POST/GET.

Edit1

Please see this thread on how to make asynchrnonous GET requests in php. The next is quoted from this source

file_get_contents will do what you want

$output = file_get_contents('http://www.example.com/');
echo $output;

Edit: One way to fire off a GET request and return immediately.

Quoted from http://petewarden.typepad.com/searchbrowser/2008/06/how-to-post-an.html

function curl_post_async($url, $params)
{
    foreach ($params as $key => &$val) {
      if (is_array($val)) $val = implode(',', $val);
        $post_params[] = $key.'='.urlencode($val);
    }
    $post_string = implode('&', $post_params);

    $parts=parse_url($url);

    $fp = fsockopen($parts['host'],
        isset($parts['port'])?$parts['port']:80,
        $errno, $errstr, 30);

    $out = "POST ".$parts['path']." HTTP/1.1\r\n";
    $out.= "Host: ".$parts['host']."\r\n";
    $out.= "Content-Type: application/x-www-form-urlencoded\r\n";
    $out.= "Content-Length: ".strlen($post_string)."\r\n";
    $out.= "Connection: Close\r\n\r\n";
    if (isset($post_string)) $out.= $post_string;

    fwrite($fp, $out);
    fclose($fp);
}

Answer 2

looking at your code you are trying to submit a form and submit a secondary form afterwards...

if(isset($_POST['submit'])) {
    ?>
    <script type="text/javascript">
        document.js_form.submit();
    </script>
    <?php

if your 2nd form data is NOT dependant on the first form submitted you can simple APPEND form elements to the php form - see below

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">

    var jsvariable = "js_test";

    $(document).ready(function(){
      //append form elements here...
      $('#form').append('<input type="hidden" name="js_input" value="'+jsvariable+'" />');
    });

</script>


<?php
Class testing{

    function text_test(){
        ?>
        <form method="post" name="postform" id="form">
        <input type="textbox" name="text"/>
        <input type="submit" name="submit"/>
        </form>
        <?php
    }

    function display(){
        echo $_POST['text'] . '<br>';
        echo $_POST['js_input'];
    }
}

$test = new testing();
$test->text_test();

if(isset($_POST['submit'])) {
    $test->display();
}

?>

Answer 3

You can submit them separately via Ajax. Here's an example using jQuery and the Form Plugin. Should get you started.

     $('form').each(function () {
            $(this).ajaxForm();  //Initialize as ajaxForm
            var options = {
               success: succesCallback,
               error: errorCallback,
               context: this
            }                 
            $(this).ajaxSubmit(options); //Submit form with options above
    });