使用ajax从同一页面提交多个表单

时间:2015-08-10 13:32:22

标签: javascript php jquery ajax forms

我有一个页面可以从我的数据库中加载一堆问题。

这些问题都有两种形式。

像:

<div class="col-xs-6">
    <form method="post" action="" id="knowId-XXXXX-y">
        <input type="hidden" name="userKnewStatus" value="YES">
        <input type="hidden" name="knowId" id="knowId" value="#ID">
        <input type="hidden" name="knewStatus" id="knewStatus" value="1">
        <button class="btn btn-success dyk-btn" type="submit">
            Ja <i class="fa fa-smile-o fa-fw"></i>
        </button>
    </form>
</div>

<div class="col-xs-6">
    <form method="post" action="" id="knowId-XXXXX-n">
        <input type="hidden" name="userKnewStatus" value="YES">
        <input type="hidden" name="knowId"  id="knowId" value="#ID">
        <input type="hidden" name="knewStatus" id="knewStatus" value="0">
        <button class="btn btn-danger dyk-btn" type="submit">
            Nej <i class="fa fa-meh-o fa-fw"></i>
        </button>
    </form> 
</div>

要提交表单,我在Jquery / ajax中有以下代码。

<script type='text/javascript'>
    /* attach a submit handler to the form */
    $("form").submit(function(event) {

        /* stop form from submitting normally */
        event.preventDefault();

        /* get some values from elements on the page: */
        var $form = $( this ), 
            url = $form.attr( 'action' );

        /* Send the data using post */
        var posting = $.post( url, { knowId: $('#knowId').val(), knewStatus: $('#knewStatus').val() } );

        /* Alerts the results */
        posting.done(function( data ) {
        alert('success');
        });
    });
</script>

表单已提交,但由于表单的ID重复,因此第一个值始终会发送到该行。

如何指定jquery从表单本身中选择id?

我根本不喜欢jquery,但我试图插入&#34;这个&#34;但后来我收到了错误。

1 个答案:

答案 0 :(得分:2)

首先将ID属性更改为Classes,其中包含具有相同ID的元素,正如有人已经说过的那样,ID应该在您的页面上是唯一的。然后你可以通过以下方式从你点击的表单中获取该类:

$form.find('.knowId').val();