Question

我想知道是否可以使提交表单按钮采取多个操作。目前我正在使用自定义表单，该表单将使用AJAX发送到Google电子表格。我也在使用Blueimp Jquery File Upload插件。我希望的是，提交所有相关信息可以发送到Google电子表格，并将上传的图像发送到我的服务器。我对任何不涉及Blueimp Jquery Upload的潜在解决方案持开放态度，并使用Google Spreadsheets来允许多个协作者访问数据。

对于因为我不精通文件上传而遗漏的任何细节，我深表歉意，但请询问，我会尽力提供所有相关信息。

Google电子表格提交代码：

// Handle form submission
$('form').submit(function(e) {
    var button = $('input[type=submit]', this),
        data = $(this).serialize();`

    e.preventDefault();
    if (validate($(this))) {
        button.button('loading');
        $.ajax({
            type: 'POST',
            url: formUrl,
            data: data,
            complete: function() {
                button.button('reset');
                window.location = 'index.html#new';
            }
        });
    }

    function validate(form) {
        $('.control-group').removeClass('error');
        $('input, textarea', form).each(function() {
            var tag = $(this)[0].tagName.toLowerCase(),
                type = $(this).attr('type');

            // Validate radio buttons
            if (tag === 'input' && type === 'radio') {
                var name = $(this).attr('name');
                if ($('[name="' + name + '"]:checked').length < 1) {
                    $(this).parent().parent().parent().addClass('error');
                }
            }

            // Validate text fields
            if ((tag === 'input' && type === 'text') || tag === 'textarea') {
                if ($(this).val() === '' && !$(this).parent().hasClass('radio')) {
                    $(this).parent().parent().addClass('error');
                }
            }
        });

        if ($('.control-group.error').length < 1) return true;
        $('.control-group.error').length

        $('html, body').animate({
            scrollTop: $('.control-group.error').offset().top - 20
        }, 500);

        return false;
    }
});

Answer 1

如果您有表单提交按钮（或任何其他输入）：

<button href="#" id="formButton" type="button">Submit</button>

使用JavaScript，您可以在按钮上创建一个点击事件来进行表单提交：

$('#formButton').click(submitMultipleForms());

然后在您的功能中，您可以提交表格。每个表单都应该有一个id：

function submitMultipleForms() {
       $("#form1").submit(function() { //Handler for form1 
                                     });
       $("#form2").submit(function() { //Handler for form2
                                     });
}

可以使表单按钮采取多个操作？

1 个答案: