提交表单,然后从新页面将表单数据发送到ajax [英] Submit form, then send form data to ajax from a new page

查看:139
本文介绍了提交表单,然后从新页面将表单数据发送到ajax的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在page1.php上有一个表单,该表单重定向到page2.php,我想在加载page2.php时立即将数据从表单传递到page3.php. (用户无需查看第3页的内容,只需查看第2页的内容)

I have a form on page1.php which redirects to page2.php, I want to pass the data from the form to page3.php immediately on load of page2.php. (the user doesn't need to see what's going on in page3, only page2)

我应该使用什么来传递变量?目前我正在使用

What should I use to pass the variables? Currently I'm using

page1.php

page1.php

    <html>
            <form action=page2.php method=post>
                    <!-- form content here incl name attr for input elements -->
            </form>
    </html>

page2.php

page2.php

    <body>
    <?php
            $var1 = $_POST['name1']; // int   
            $var2 = $_POST['name2']; // int   
            $var3 = $_POST['name3']; // int 
            $var4 = $_POST['name4']; // str
    ?>
    <!-- some code here -->
    <script>
            var var1 = <?php echo $var1; ?>;        
            var var2 = <?php echo $var2; ?>;        
            var var3 = <?php echo $var3; ?>;        
            var var4 = "<?php echo $var4; ?>";        
            $.post('page3.php',{var1: var1, var2: var2, var3: var3, var4: var4});         
    </script>
    </body>

page3.php

page3.php

    <?php        
            $var1 = $_POST['var1'];
            $var2 = $_POST['var2'];
            $var3 = $_POST['var3'];
            $var4 = $_POST['var4'];
    ?>

a.这对我来说似乎太多了,是否有任何jquery快捷方式?如何使用序列化来帮助我? b.这不能完全正常工作...我认为$ .post存在一些问题,也许我没有很好地触发它?我不确定.

a. This seems like way too much to me, are there any jquery shortcuts? How can I use serialize to help me? b. this isn't working entirely... I think there's some problem with the $.post, maybe I'm not triggering it well? I am not sure.

我们将不胜感激.

推荐答案

通过这种方式,您将完全击败ajax的第一个A,异步.您应该做的是将ajax调用添加到首页上表单的Submit事件中.

By doing this way your completely defeating the first A of ajax, asynchronous. What you should do is add the ajax call to the submit event of the form on your first page.

<form action="action.php" method="GET" id="form">
    <input name="var1" />
    <input name="var2" />
    <input name="var3" />
    <input name="var4" />

    <input type="submit" />
</form>

<script>
$('#form').submit(function() {
    $.post('action.php', {
        var1: $('input[name="var1"]').val(),
        var2: $('input[name="var2"]').val(),
        var3: $('input[name="var3"]').val(),
        var4: $('input[name="var4"]').val()
    });        

    return false; //Prevent form from actually submitting
});
</script>

这样,如果用户使用javascript,则jQuery异步提交表单(不需要加载新页面).但是,如果用户没有javascript,则可以正常提交表单.

This way if the user has javascript, the form is submitted asynchronously (not requiring a new page to be loaded) by jQuery. But if the user doesn't have javascript, the form is submitted normally.

即使在用户离开后,也要确保page3.php(我称为action.php)继续执行,您应该查看 set_time_limit() .

To ensure that your page3.php (what I called action.php) continues to execute even after the user navigates away you should look into ignore_user_abort() and set_time_limit().

//At the top of page3.php
ignore_user_abort(true);  //Allow user to navigate away
set_time_limit(0);        //Allow script to run indefinitely

并且正如我上面所建议的,您仍然应该像以前一样使用AJAX提交表单.我上面提到的两个PHP函数将消除对中间脚本page2.php的需要.像这样:

And as I suggested above, you should still submit the form with AJAX like I did. The two PHP functions I mentioned above will eliminate the need for the intermediary script, page2.php. Like so:

page1.php

<form action="" method="get" id="form">
    <input name="var1" />
    <input name="var2" />
    <input name="var3" />
    <input name="var4" />

    <input type="submit" />
</form>

<script>
$('#form').submit(function() {
    $.post('page3.php', {
        var1: $('input[name="var1"]').val(),
        var2: $('input[name="var2"]').val(),
        var3: $('input[name="var3"]').val(),
        var4: $('input[name="var4"]').val()
    });        

    return false; //Prevent form from actually submitting
});
</script>

用户现在可以填写page1.php并单击提交"按钮. jQuery将拦截表单提交并通过AJAX将数据发送到page3.php.

The user can now fill out page1.php and hit the submit button. jQuery will intercept the form submit and send the data via AJAX to page3.php.

page3.php

ignore_user_abort(true);  //Allow user to navigate away
set_time_limit(0);        //Allow script to run indefinitely

//Rest of processing code...

page3.php将收到AJAX请求并开始执行其工作.当用户离开page1.php时,AJAX请求将被取消(并且与page3.php的请求的连接将丢失),但是page3.php将继续运行.

page3.php will receive the AJAX request and begin to do its work. When the user navigates away from page1.php the AJAX request will be canceled (and the connection to the request for page3.php will be lost), but page3.php will continue to run.

这篇关于提交表单,然后从新页面将表单数据发送到ajax的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆