用jquery / ajax提交循環表單？

Question

我有用PHP在foreach循環中創建的表單。

每種形式的lpformnum都會增加

<form lpformnum="1"><button class="update" /></form>
<form lpformnum="2"><button class="update" /></form>
<form lpformnum="3"><button class="update" /></form>
etc.

我正在使用jquery / ajax來阻止表單的默認操作，因此我可以通過ajax提交表單。

<script>
    $(document).ready(function(){        
        $('.alert').on('click', 'button[class=update]', function(e) {
         e.preventDefault();
         e.stopPropagation();
            var checkValues = $("#update").val();
            var checkCred = $("#ucredits").val();
            var checkPost = $("textarea").text();
            var checkType = $("i").text();
            $.ajax({
                type: "POST",
                url: "update_social_cred.php",
                data: { id: checkValues, credits: checkCred, text: checkPost, type: checkType  },
                success:function(result) {
                 alert (checkCred);
                }
            });
        });
    });
</script>

問題是，每個按鈕都提交頁面上繪制的第一個表單。 我該怎么做，以便每個按鈕都設置為每種表單，同時要記住要繪制的表單數量未知？

Answer 1

我想您應該使用find()方法闡明要提交的數據。

$('.alert').on('click', 'button[class=update]', function(e) {
    e.preventDefault();
    e.stopPropagation();

    // find parent form of a button
    var form = $(this).closest( "form" );

    // I suppose these are unique fields.
    var checkValues = $("#update").val();
    var checkCred = $("#ucredits").val();
    var checkPost = $("textarea").text();
    // if they are not you should use classes instead:
    // something like:
    // var checkCred = form.find(".ucredits").val();

    // find values in a `form` with `find` method
    var checkType = form.find("i").text();

    // pass your data to ajax.