通过Ajax在表中提交表单数据总是发送第一行PHP

Question

这个表有很多行，每行有几列，基本上都是作为自己的迷你形式完成的。变量$ y自动递增，并标识应提交哪一行。我的旧形式pre-ajax看起来像这样：

<tr>
    <form id='form$y' action=".htmlspecialchars($_SERVER["PHP_SELF"])." method='post''/>
    <input type='hidden' form='form$y' name='id' value='$id' />
    <td>
        <input style='height:18px' form='form$y' type='date' name='date value='$date'/>                                                                                                     
    </td>
    <td>    
        <select name='status' form='form$y' required/>
          <option>$status</option>
          <option value='option1'>option1</option>
          <option value='option2'>option2</option>
        </select>
    </td>
    <td>
        <input form='form$y' type='text' name='comment' value='$comment'/>
    </td>
    <td>
        <input  type='submit' value='Save' />
        </form> 
    </td>               
</tr>";

我现在尝试通过Ajax做同样的事情，以便在提交时页面不刷新，我的代码看起来像这样：

<tr>
    <form id='form$y' class='col-lg-3'/>
    <div class='form-group'>            
    <input type='hidden' name='id' class='form-control id' value='$id' />
    </div>  
    <td>
        <div class='form-group'>
            <input style='height:18px' form='form$y' type='date' name='date' class='form-control date' value='$date' required/>                                                                                                     
        </div>
    </td>
    <td>    
        <div class='form-group'>
            <select name='status' form='form$y' required/>
              <option>$status</option>
              <option value='option1'>option1</option>
              <option value='option2'>option2</option>
            </select>
        </div>
    </td>
    <td>
        <div class='form-group'>
        <input form='form$y' type='text' name='comment' class='form-control comment' value='$comment'/>
            </div>
    </td>
    <td>
        <input type='button' form='form$y'  class='btn btn-default send' value='Submit'>
        </form> 
    </td>               
</tr>";

在旧表单中，它始终正常工作，并且提交了表中该行的数据。在新表单中，无论我按下“提交”按钮的哪一行，它总是从第一行提交数据。

Ajax是：

$(document).ready(function(){

    function send_email(id,date,status,comment){
        $.post('post.php',{id:id,date:date,status:status,comment:comment}, function(data){
        if (data==='sent') {
            alert('sent');
        }else{
            alert('error');
        }


    });
    }


    $('.send').click(function(){
        var id = $('.id').val();
        var date = $('.date').val();
        var status = $('.status').val();
        var comment = $('.comment').val();
        send_email(id,date,status,comment);

    })


})

有没有办法确保提交正确表单的值？表单ID不能通过Ajax工作吗？我从几个来源拼凑了Ajax，因为我不经常使用它。