1

我有以下格式的代码。

PHP 文件：

<form action="http://clientwebapi.com/createEvent" id="form_createEvent" method="post" enctype="multipart/form-data">
<input type="text" name="image_title" />
<input type="file" name="media" accept="image/*,video/*"/>
</form>

JQUERY 文件：

$('#form_createEvent').submit(function () {
    var form = $(this);
    $.ajax({
        url: form.attr("action"),
        type: form.attr("method"),
        xhrFields: {
            withCredentials: true
        },
        data: form.serialize()
    }).done(function () {
        showCurrentLocation();
        alert('Event created successfully..');
        location.reload();

    }).fail(function () {
        alert("fail!");
    });
    event.preventDefault();
});

上面的 Jquery 代码正在提交。此外，当我提交以下格式时，它将重定向到“ http://clientwebapi.com/createEvent ”并且事件创建成功。

表单提交并重定向到客户端页面：

$('#form_createEvent').submit(function () {
    var fd = new FormData();
    fd.append('media', input.files[0]);

    $.ajax({
        url: form.attr("action"),
        data: fd,
        processData: false,
        contentType: false,
        type: form.attr("method"),
        success: function (data) {
            alert(data);
        }
    });
event.preventDefault();

});

在这里如何防止提交表单并使用给定图像创建事件。请帮助

4

3 回答 3

1

我找到了答案。我在这里犯了一些错误。我通过使用下面的代码解决了..

$('#form_createEvent').submit(function() { 
            var form = new FormData($(this)[0]); 
            $.ajax({
                url: 'http://clientwebapi.com/createEvent/',
                type: 'POST',
                xhrFields: {
                    withCredentials: true
                },
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                data: form,
                beforeSend: function () {
                    $("#output_process").html("Uploading, please wait....");
                },
                success: function () { 
                    $("#output_process").html("Upload success.");
                },
                complete: function () {
                    $("#output_process").html("upload complete.");
                },
                error: function () {
                    //alert("ERROR in upload");
                    location.reload();
                }
            }).done(function() { 
                alert('Event created successfully..');

            }).fail(function() {
                alert("fail!");
            });
            event.preventDefault();
        });
于 2013-08-30T09:45:22.473 回答
1

您忘记将事件作为参数添加到提交函数：

$('#form_createEvent').submit(function (event) {
于 2013-08-28T09:54:10.143 回答
0

您可以通过以下方式停止表单提交return false;

$('#form_createEvent').submit(function () {
    // some code
    $.ajax({
        // some code/objects
    });

    return false; // here, it will stop the form to be post to the url/action

});
于 2013-08-28T09:57:17.527 回答