Ajax：使用表单名称提交表单

Question

Ajax：使用表单名称提交表单

3

我有一个如下的表单

<form autocomplete="off" id="settleUp" name="settleUp" method="post" role="form">
    <div class="col-lg-5 col-md-5 col-sm-5 col-xs-12">
        <div class="form-group">
             <div class="input-group">
                  <h4>Gautam Sawala</h4>
             </div>
        </div>
    </div>
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">
          <div class="form-group">
               <div class="input-group">
                    <span class="input-group-addon">
                          <i class="fa fa-eur"></i>
                    </span>
                    <input onChange="checkInput(this);" step="0.01" type="number" class="form-control" id="amount" name="amount" value="0.00" placeholder="0.00" min="0.00" required>
                    <input id="payeeId" name="payeeId" value="3" hidden required>
               </div>
          </div>
   </div>
   <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
         <div class="form-group">
              <div class="input-group">
                  <input type="submit" class="btn btn-success" value="Pay Back">
              </div>
   </div>
</div>

我希望将这个表单作为ajax表单提交：

我想以ajax表单提交的形式提交此表单，

$("#settleUp").submit(function(e){
        alert('here');
        $.ajax({
            type:"PUT",
            url: "/api/v1/settlements",
            data: $(this).serialize()+'&groupId='+'<?php echo $_GET['group_id'] ?>'+'&userId='+'<?php echo $_SESSION['userId'] ?>'+'&token='+'<?php echo $_SESSION['token'] ?>',
            dataType: "json",
            success: function(response){
                refreshExpenseListing();
                $('#settleUpModal').modal('hide');
                },
            error: function(data) {
                alert("failure");
              }
        });

        e.preventDefault();
    });

我能够使用表单的id来提交表单：$("#settleUp").submit(function(e)

但是我有多个上述表单，并且我想使用name而不是id来提交表单。

在AJAX中是否有这样的方法呢？例如： $("form[formname]").submit(function(e)?

我已经尝试过$("form.settleUp").submit(function(e)，但这并不起作用！

- Gautam Sawala

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Zakaria Acharki · Accepted Answer

您可以使用属性等于选择器来实现：

$("form[name='settleUp']").submit(function(e){
    //Your code here
}

抱歉，我只能用英语回答问题。如果您有需要，我可以尽力解释一些技术术语和概念，以帮助您更好地理解内容。

$("form[formname]").submit(function(e)
Your first attempt will not work since you give just the value formname without specifying the concerned attribute.

第二次尝试：

$("form[formname]").submit(function(e)
It will not work it your form has a class name equal settleUp since . is a class selector.

处理由ajax动态添加到文档中的表单时，您必须使用事件委托 on() ：

$('body').on('submit', "form[name='settleUp']", function(e)

希望这能有所帮助。