验证后将表单发送到parse.com

时间:2015-01-22 10:20:46

标签: jquery html parse-platform

我想将表单发送到parse.com,但前提是所有字段都已填写。问题是即使使用验证脚本,即使所有字段都为空,表单仍然会在我按下提交按钮时提交。

我尝试过使用按钮代替输入类型=提交,但即使填写了所有字段,表单也不会发送到parse.com。

我有以下HTML& JQuery的:

HTML:

<form id="vcardForm" method="post">
    <p>
        <input type="text" id="name" name="name" required />
    </p>
    <p>
        <input type="text" id="vorname" name="vorname" required />
    </p>
    <p>
        <input type="text" id="email1" name="email1"  required />
        <label id="atteken" >@</label>
        <input type="text" id="email2" name="email2 "  required />
        <textarea  id="fullemail" name="fullemail"></textarea>
            <p>
        <input type="text" id="telefon" name="telefon" onclick="getFullemail()"     />
    </p>
    <p>
        <input type="text" id="firma" name="firma" required />
    </p>
    <p>
       <input type="submit" id="submitBtn" onclick="functions() return false;">

       <script type="text/javascript">
            function getFullemail() {
                document.getElementById('fullemail').value =
                        document.getElementById('email1').value + '@' +
                        document.getElementById('email2').value;
            }

</script>

<script>
function validateForm() {
    var name = document.getElementById('name').value;
    var vorname = document.getElementById('vorname').value;
    var email = document.getElementById('fullemail').value;
    var firma = document.getElementById('firma').value;
    var telefon = document.getElementById('telefon').value;

    if(name == '' || vorname == '' || email == '' || firma == '' || telefon == '' ) {
        alert('Bitte alle Felder ausfüllen. Danke.');
    }else {
        document.vcardForm.submit();
    }
}
</script>

<script>
    function functions() {
        validateForm();
    }
</script>

Jquery的:

$(document).ready(function() {

    var parseAPPID = "bla";
    var parseJSID = "bla";

    Parse.initialize(parseAPPID, parseJSID);
    var VcardObject = Parse.Object.extend("VcardObject");

    $("#vcardForm").on("submit", function(e) {
        e.preventDefault();

        console.log("Handling the submit");
        //add error handling here
        //gather the form data

        var data = {};
        data.name = $("#name").val();
        data.vorname = $("#vorname").val();
        data.fullemail = $("#fullemail").val();
        data.telefon = $("#telefon").val();
        data.firma = $("#firma").val();

        var vcard = new VcardObject();
        vcard.save(data, {
            success:function() {
            openPage('danke');
                console.log("Success");
            },
            error:function(e) {
                console.dir(e);
            }
        });

    });

});

非常感谢任何帮助。

感谢。

1 个答案:

答案 0 :(得分:1)

使用jquery表单提交如下

$(document).ready(function() {

    // process the form
    $('#vcardForm').submit(function(event) {

        // get the form data
        var formData = {
        data.name = $("#name").val();
        data.vorname = $("#vorname").val();
        data.fullemail = $("#fullemail").val();
        data.telefon = $("#telefon").val();
        data.firma = $("#firma").val();

        var vcard = new VcardObject();
        };

        // process the form
        $.ajax({
            type        : 'POST',
            url         : 'parse.com', // **the url where you want to POST**
            data        : formData, // our data object
            dataType    : 'json', // what type of data do we expect back from the server
                        encode          : true
        })
            // using the done promise callback
            .done(function(data) {

                // log data to the console so we can see
                console.log(data); 

                // here we will handle errors and validation messages
            });

        // stop the form from submitting the normal way and refreshing the page
        event.preventDefault();
    });

});

只有网址:'parse.com'在这里不起作用。您必须指定等待数据的文件。例如:'parse.com/index.php'

希望这有帮助