0

フォーム検証用のスクリプト（validationEngine）とファイルアップロード用のスクリプト（uploadify）を使用しています。

フォームの送信を最適に管理するには：

  • validateEngineは、フォームを送信できるかどうかを検出します。
  • 送信できる場合は、ファイルをアップロードします
  • アップロードしたすべてのファイル（onQueueCompleteuploadify）が完了したら、フォームを送信します。

alert('foo');onQueueCompleteでを作成すると、機能します。しかし、私が提出した場合selector.submit()...何も起こりません。

$(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','*');
        }
    });
});

このコードでは、すべてが機能しますが、送信は機能しません。イベントが存在しないようです。

4

3 に答える 3

2

2つのこと：

（1）他の場所のセレクターはですが、非機能呼び出しで#validator使用しています。validator

（2）に発生preventDefaultするすべてのsubmitイベントを#validator実行しているため、イベントが正しくトリガーされた場合でも、送信アクションは実行されません。代わりに、ネイティブDOM要素のsubmitアクションを呼び出す必要があります。

$('#validator')[0].submit();

[0]submit選択範囲からネイティブDOM要素を取得してから、ネイティブ関数を呼び出します。これは、jQueryハンドラーが実行されないことを意味します。したがって、実行するevent.preventDefault呼び出しも実行されないため、イベントは機能します。

于 2012-05-23T16:10:46.783 に答える
1

すべきではない：

$('#validator').submit();
于 2012-05-23T16:10:42.013 に答える
0

この方法は、自分でタスクを複雑にします。私は新しいルーチンをもっと簡単にすることにしました。

ファイルを自動的にロードします。そして、削除する要素を作成しました。

とにかく、私のメールを送信するために、添付ファイルは破棄されます。

これが私の新しいコードで、動作します。

/**
 * 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();     
});
于 2012-05-24T08:59:19.277 に答える