Question

我在做这项工作时遇到了麻烦。我需要在同一页面上有多个表格......我尝试了无数的东西，但似乎没什么用。

我在这里要做的是确定每个表单（以某种方式），以便在页面上提交那个表单而不是FIRST表单。下面的代码有效，但总是以相同的形式提交，第一个！

这是我当前的代码

JS：

$(document).ready(function(){

    $('.submit').on("click", function() {

        var artworkId = $("#inquirebox").data("artworkid");

        $.post("send.php";, $("#artinquire"+artworkId).serialize(), function(response) {
            $('#success').html(response);
        });

        return false;

    });

});

HTML：

<div id="inquirebox" data-artworkid="<?php echo 456;?>">
    <form action="" method="post" id="artinquire<?php echo 456;?>" data-artworkid="<?php echo 456;?>">
        <label for="name">Name:</label><br />
        <input type="text" name="name" id="name" /><br />

        <label for="email">Email:</label><br />
        <input type="text" name="email" id="email" /><br />

        <label for="message">Message:</label><br />
        <textarea name="message" id="message"></textarea><br />

        <input type="hidden" name="id" value="<?php echo 456;?>">
        <input type="hidden" name="artist" value="<?php echo $title1; ?>">
        <input type="hidden" name="url" value="<?php echo $uri1; ?>">
        <input type="hidden" name="artwork" value="<?php echo $artwork1; ?>">

        <input type="button" value="send" class="submit" id="submit" data-artworkid="<?php echo 456;?>">
        <div id="success"></div>
    </form>
</div>

Answer 1

您在表单周围的所有DIV包装器上使用相同的ID。

ID必须是唯一的，所以你可以使用一个类，但你根本不需要任何标识符，也不需要数据属性，.submit按钮在表单内，所以你需要this.form或更多jQuery'ish $(this).closest('form')来获取父表单

$(document).ready(function(){

    $('.submit').on("click", function() {

        var form = $(this).closest('form');

        $.post("send.php", form.serialize(), function(response) {
            form.find('.success').html(response);
        });

        return false;

    });
});

但是，您应该使用#success元素上的类来根据表单找到它。

同一页面上的多个表单AJAX

1 个答案: