将JSON数据从表单发送到外部页面

时间:2016-08-23 13:48:17

标签: jquery json post serialization push

下面的脚本目前将表单数据序列化并在结果DIV中以JSON格式显示,但也希望将数据发布到Web API端点,作为测试我使用的是form-data.php,但是我只是不能让它工作,谁能看到我哪里出错了?

// JAVASCRIPT

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

$(function() {

    // Attach a submit handler to the form
    $( "#signUpForm" ).submit(function( event ) {


        $('#result').text(JSON.stringify($('#signUpForm').serializeObject()));


        var data = $('#signUpForm').serializeArray();
        data.push({name: 'Email', value: Email});

        $.post("form-data.php", data);


        return false;

    });

});

我也尝试过使用......

 $.post("form-data.php",( $('#signUpForm').serialize()+'&'+$.param({ 'Email': Email })));

HTML表格

        <form id="signUpForm" action="" method="post">

            Email:<input type="text" name="Email" maxlength="50" size="50"/> <br/>
            Username:<input type="text" name="Username" maxlength="12" size="12"/> <br/>
            First Name:<input type="text" name="FirstName" maxlength="12" size="12"/> <br/>
            Last Name:<input type="text" name="LastName" maxlength="36" size="12"/> <br/>
            Company:<input type="text" name="Company" maxlength="36" size="12"/> <br/>
            Role:<input type="text" name="Role" maxlength="36" size="12"/> <br/>
            Country:<input type="text" name="Country" maxlength="36" size="12"/> <br/>
            Company:<input type="text" name="Company" maxlength="36" size="12"/> <br/>
            Telephone:<input type="text" name="Telephone" maxlength="36" size="12"/> <br/>
            Security Question:<input type="text" name="SecurityQuestion" maxlength="36" size="12"/> <br/>
            Security Answer:<input type="text" name="SecurityAnswer" maxlength="36" size="12"/> <br/>

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

        <h2>JSON</h2>
        <pre id="result">
        </pre>

0 个答案:

没有答案