preventDefault之后无法提交 [英] Can't submit after preventDefault

问题描述

我使用用于表单验证的脚本(validationEngine)和用于文件上载的脚本(uploadify).

I use a script for form validation (validationEngine) and a script for file upload (uploadify).

为了最好地管理我的表单提交:

To best manage my form submission:

• validationEngine检测是否可以发送我的表格.
• 如果可以提交，我可以上传文件
• 所有上传的文件(onQueueComplete uploadify)之后，我将提交表单.

• validationEngine detects if my form can be sent.
• If I can submit, I upload my files
• Once all my uploaded files (onQueueComplete uploadify), I submit my form.

如果我在onQueueComplete中创建一个alert('foo');，它将起作用.但是，如果我提交我的selector.submit() ...什么也没发生.

If I make an alert('foo'); in my onQueueComplete, it works. But if I submit my selector.submit() ... nothing happens.

$(function() {
    $('#file_upload').uploadify({
        'fileSizeLimit' : '2048KB',
        'auto': false,
        'swf'      : '<?php echo site_url('public/modules/uploadify/uploadify.swf')?>',
        'uploader' : '<?php echo site_url('public/modules/uploadify/uploadify.php')?>',
        'buttonText' : 'Ajouter...',
        'method' : 'post',
        'formData' : {'userMail' : '<?php echo $userMail ?>'},
        'onQueueComplete' : function(queueData) {
            $('#validator').submit();
        } 
    });
});

$(document).ready(function() {
    $("#validator").validationEngine();
    $('#validator').submit(function(event){
        event.preventDefault();
        var canSubmit = $("#validator").validationEngine('validate');
        if(canSubmit)
        {
            $('#file_upload').uploadify('upload','*');
        }
    });
});

使用此代码，除了提交外所有作品均无效.好像该事件不存在.

With this code, all works but submit doesn't work. It's like the event doesn't exist.

推荐答案

此方法使任务本身复杂化.我决定简化一个新例程.

This method complicates the task myself. I decided to do a new routine easier.

我让文件自动加载.我刚刚创建了要删除的元素.

I let the file load automatically. And I just created elements that I delete.

无论如何，要发送我的邮件，文件附件将被破坏.

Anyway, to send my mail, file attachments will be destroyed.

这是我的新代码，它可以工作.

here is my new code and it works.

/**
 * uploadify
 * 
 * we add a onUploadStart event to manage the file. uploadify uploads directly our files, but maybe the user missclick
 * and wants to remove some file.
 * 
 * The send action (controller webmail) doesn't upload files, uploadify do that for us.
 * We just need in the post for the name of the file registered in a hidden input.
 */
$(function() {
    $('#file_upload').uploadify({
        'fileSizeLimit' : '2048KB',
        'swf'      : '<?php echo site_url('public/modules/uploadify/uploadify.swf')?>',
        'uploader' : '<?php echo site_url('public/modules/uploadify/uploadify.php')?>',
        'buttonText' : 'Ajouter...',
        'method' : 'post',
        'formData' : {'userMail' : '<?php echo $userMail ?>'},
        'onUploadStart' : function(file){
            $('#uploadList').append('<div class="file"><a href="#" class="deleteFile" rel="'+file.name+'">'+file.name+' - [x]</a><input type="hidden" name="files[]" value="'+file.name+'" /></div>');
        }

    });

    /**
     * the .deleteFile elements are added after domready. We have to attach event click.
     * We remove the parent block to remove a file of mail attachment
     */
    $('#uploadList').on('click','.deleteFile',function(){
        var rel = $(this).prop('rel');
        /*$('input[value="'+rel+'"]').remove();*/
        $(this).parents('div:first').remove();
    });
});

$(document).ready(function() {
    $("#message").cleditor()[0].focus();

    $("#validator").validationEngine();     
});

这篇关于preventDefault之后无法提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！