0

http://www.malsup.com/jquery/form/#html

1ページに複数のフォームがあります。それらはすべて同じクラス「myForm」を使用します。上記の拡張機能を使用して、正常に処理し、POSTすることができますajax-process.php。

<script> 
    // wait for the DOM to be loaded 
    $(document).ready(function() { 
        // bind 'myForm' and provide a simple callback function 
        $('.myForm').ajaxForm(function() { 
            alert("Thank you for your comment!"); 
        }); 
    }); 
</script>

ただし、応答に問題があります。ユーザーが送信したコメントを取得して、送信元のそれぞれのdivに表示する必要があります。これをフォームの非表示フィールドとして設定することも、ajax-process.phpファイルのテキストとして設定することもできます。

ajax-process.php次のコマンドを実行すると、すべてのフォームに追加されます（明らかに）。スクリプトで使用できるものに応答を取得する方法を理解できません。

私が考えることができる唯一の方法は、単一のクラスではなく、個々のDIVIDを使用してスクリプトを繰り返すことです。ajax-process.phpただし、返されるdivを更新する方法が必要です。

// prepare the form when the DOM is ready 
$(document).ready(function() { 
    // bind form using ajaxForm 
    $('.myForm').ajaxForm({ 
        // target identifies the element(s) to update with the server response 
        target: '.myDiv', 

        // success identifies the function to invoke when the server response 
        // has been received; here we apply a fade-in effect to the new content 
        success: function() { 
            $('.myDiv').fadeIn('slow'); 
        } 
    }); 
});

助言がありますか？

4

2 に答える 2

0

ドキュメンテーション：

成功

フォームの送信後に呼び出されるコールバック関数。'success'コールバック関数が提供されている場合、サーバーから応答が返された後に呼び出されます。次の引数が渡されます。

  1. responseTextまたはresponseXML値（dataTypeオプションの値によって異なります）。
  2. statusText
  3. xhr（またはjQuery <1.4を使用している場合はjQueryでラップされたフォーム要素）
  4. jQueryでラップされたフォーム要素（またはjQuery <1.4を使用している場合は未定義）

つまり、オプションは次のようになります。

$('.myForm').ajaxForm({
    // success identifies the function to invoke when the server response 
    // has been received; here we apply a fade-in effect to the new content 
    success: function(response, undefined, undefined, form) {
        //find .myDiv class in the current form
        form.find('.myDiv').html(response).fadeIn('slow');
    }
});​

デモ

于 2012-12-15T22:23:43.487 に答える
0

このコードを試してください：

// prepare the form when the DOM is ready
$(document).ready(function() {
    // bind form using ajaxForm
    $('.myDiv').each(function() {
        var self = this;
        $(this).find("form").ajaxForm({
            // target identifies the element(s) to update with the server response
            target: this,

            // success identifies the function to invoke when the server response
            // has been received; here we apply a fade-in effect to the new content
            success: function() {
                $(self).fadeIn('slow');
            }
        });
    });
});

作業サンプル（ボタンを押す前に「実行」を押してください）

于 2012-12-15T23:02:00.227 に答える