0

週末の何か。ajaxForm プラグインを使用していますが、正常に動作します。しかし、after() を使用して作成されたフォームは、URL に正常に送信されるだけで、ajax を投稿します。

$("a.update-time").live("click", function(event) {

            event.preventDefault(); 
            var row = $(this).attr("id").split('-');

            $("#update-mini-form").remove();

            $(this).after(
                '<div id="update-mini-form"><form method="post" action="' + 'http://drupal.se/timetracker/timetracker/update_time/' + row[1] + '"> ' +
                '<input type="textfield" name="title" value="">' +
                '<input type="textfield" name="event_date" value="">' +
                '<input type="textfield" name="hours" size="2" value="">' +
                '<input type="submit" value="update">' +
                '</form></div>'                 
                );
        });

        $('#update-mini-form').live("submit", function(){

                var row = $(this).closest('a').attr("id").split('-');
                $(this).ajaxForm({
                        url: 'http://drupal.se/timetracker/timetracker/update_time/' + row[1],
                        target:$("div#row-" + row[1]),
                        type: "POST",
                });

        });
4

2 に答える 2

0

さて、私はこれを機能させました。私は単一のフォームについてアドバイスしますが、 live() はまだ必要でした。JSで何かを移動/コピーしても、それはまだページの一部ではないからだと思います。セレクターも間違っていましたが、修正しても役に立ちませんでした。また、最も近いのはフォームを移動することによって殺されていましたが、 live() はこれを助けません。そのため、IDをフォームに入れるようにシステムを変更する必要がありました。これは私が使用したものです：

php:

$output .=  '<div><form method="post" style="display:none" id="update-mini-form" action="' . 'http://drupal.se/timetracker/timetracker/update_time">' .
                '<input type="textfield" name="title" value="">' .
                '<input type="textfield" name="event_date" value="">' .
                '<input type="hidden" name="id_mini_form" id="id-mini-form" value="">' .
                '<input type="textfield" name="hours" size="2" value="">' .
                '<input type="button" id="sendUpdate" value="update">' .
                '</form></div>';                
    //$output .= '<pre>' .print_r($all, 1) . '</pre>'; 
    print $output;

js:

$("a.update-time").live("click", function(event) {

            event.preventDefault(); 
            var row = $(this).attr("id").split('-');

            $("#id-mini-form").val(row[1]);

            $(this).after($("#update-mini-form").show());


        });

        $("#sendUpdate").live("click",function() {          
            $.ajax({
                        type: "POST",
                        url: "http://drupal.se/timetracker/timetracker/update_time/",
                        data: $('#update-mini-form').serialize(),
                        cache: false,
                        success: function(result){

                            $("#update-mini-form").hide();
                            alert(result);
                        }
            });

            return false;           

        });
于 2012-09-21T20:12:21.120 に答える
0

私の理解が正しければ、.live() はデリゲート ハンドラーをドキュメント要素にバインドし、イベントが発生するのをリッスンすることで機能しますよね? Vishal と Poelinca Dorin が指摘したように、現在のバージョンの jQuery では .on() を使用する必要があります。

あなたの問題は、ミニフォーム送信ハンドラーがデフォルトの送信を妨げていないことが原因である可能性があると思います。これを試して：

$("a.update-time").live("click", function(event) {
    event.preventDefault(); 
    var row = $(this).attr("id").split('-');

    $("#update-mini-form").remove();

    $(this).after(
        '<div id="update-mini-form"><form method="post" action="' + 'http://drupal.se/timetracker/timetracker/update_time/' + row[1] + '"> ' +
        '<input type="textfield" name="title" value="">' +
        '<input type="textfield" name="event_date" value="">' +
        '<input type="textfield" name="hours" size="2" value="">' +
        '<input type="submit" value="update">' +
        '</form></div>'                 
        );
});

// Note: You should probably replace $(document) with a more specific container element
$(document).on("submit", "#update-mini-form", function(event){
    event.preventDefault();
    var row = $(this).closest('a').attr("id").split('-');
    $(this).ajaxForm({
        url: 'http://drupal.se/timetracker/timetracker/update_time/' + row[1],
        target:$("div#row-" + row[1]),
        type: "POST",
    });

});
于 2012-09-21T15:32:41.963 に答える