通过JQuery AJAX / javascript发送表单数据

时间:2014-09-25 09:41:01

标签: javascript php ajax forms

我有这样的表格;

<form action="out.php" method="post">
    <input type="hidden" name="a" value="a" />
    <input type="hidden" name="b" value="b" />
    <input type="hidden" name="c" value="c" />
    <input type="hidden" name="d" value="d" />
    <input type="hidden" name="e"  maxlength="60" value="e" />
    <input type="hidden" name="f" value="f" />
    <input type="submit" value="Create & Send">
</form>

用户无法看到此表单。他们只看到一个提交按钮,如&#34;创建标签&amp;发送给客户&#34; 。 但他们需要输入客户的电子邮件地址。所以我有一个js代码,提交按钮触发它。它会询问电子邮件地址。 JS代码:

$('#dialog_prompt').click(function(){
    $.prompt("What is customer's email?","",
    function(value){
        $.msg("So, you like '"+value+"'?");
    },
    function(){
        $.msg("You clicked cancel!");
    });
});

所以我的问题是; 当用户提交按钮并输入客户的电子邮件并点击确定时,JS必须从表格&amp;电子邮件地址为&#34; out.php&#34;。

那么如何通过JS发送表单数据?

2 个答案:

答案 0 :(得分:2)

HTML:

<form action="out.php" method="post">
<input type="hidden" name="em" value="" class="customeremail" />
<input type="hidden" name="a" value="a" />
<input type="hidden" name="b" value="b" />
<input type="hidden" name="c" value="c" />
<input type="hidden" name="d" value="d" />
<input type="hidden" name="e"  maxlength="60" value="e" />
<input type="hidden" name="f" value="f" />
<input type="submit" value="Create & Send">
</form>

JS:

$('#dialog_prompt').click(function(){
    $.prompt("What is customer's email?","",
    function(value){
        $('form .customeremail').val(value);
        $('form').ajaxSubmit();
    },
    function(){
        $.msg("You clicked cancel!");
    });
});

答案 1 :(得分:0)

您可以使用AJAX发送详细信息。

$('#dialog_prompt').click(function(){
                $.prompt("What is customer's email?","",
                function(value){        
                    $.msg("So, you like '"+value+"'?");

                    $.ajax({
                    url: "out.php",   // url to which details are send
                    type: 'POST',
                    data: $('form').serialize(),   // pass form details
                    } ).done (function(data) {      // on success

                  });

                },
                function(){
                    $.msg("You clicked cancel!");
                });
            });

现在,您可以使用$_POST访问 out.php 页面中通过AJAX传递的值。

注意:serialize()方法通过序列化表单值来创建URL编码的文本字符串。