Question

这个问题已经问了好几次了，我尝试了很多解决方案，但是没有用。我有单击按钮的行，我正在打开一个模态表单，在那里我提交并关闭按钮，尽管我已经使用了event.preventdefault内部函数，但是我仍想使用jquery提交表单，但表单仍然在模态之外的click事件上自动提交

我的要求是仅通过提交按钮事件来提交表单，这是我的代码，请检查我在做什么错误

$("#itemupdateModelForm").click(function(event) {
    event.preventDefault(); // avoid to execute the actual submit of the form.
    var form = $(this);
    var url = form.attr('action');
    var newUrl = url + currentRowItemId;

    form.attr('action',newUrl);
    $( "#itemupdateModelForm" ).submit();
});

模态形式

<div class="col-xl-8 col-lg-7">
<div class="itemUpdateTaskForm">
   <form th:action="@{/category/{id}/item/(id=${categoryId})}" th:method="post" th:object=${updateItemModel} id="itemupdateModelForm">               
        <div class="modal fade" id="updateTaskModel" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel" th:text="${categoryName}">Edit</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label for="title">Current Stock Quantity:</label>
                            <input th:field="*{currentStockQuantity}" value="" type="text" class="form-control" id="crntstckqnty" name="currentstockquantity" placeholder="currentstockquantity" readonly="readonly"/>
                        </div>
                        <div class="form-group">
                            <label for="title">Item Price:</label>
                            <input th:field="*{currentPurchasePrice}" value="" type="text" class="form-control" id="current_item_price" name="current_item_price" placeholder="Current Item Price" />
                        </div>
                        <div class="form-group">
                            <label for="status">Unit:</label>
                            <select id="unit" class="form-control" name="unit" th:field=*{unit}>
                                <option th:each="status : ${T(com.inventory.domain.ItemWeightUnit).values()}"
                                        th:text="${status}" th:value="${status}">
                                </option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="title">Take Item:</label>
                            <input th:field="*{updatedQuantity}" value="" type="text" class="form-control" id="updatedQuantity" name="updatedQuantity" placeholder="updateQuantity"/>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <input type="submit" class="btn btn-primary" value="save"/>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

Answer 1

您使用错误的事件提交表单。应该提交，不要点击

$("#itemupdateModelForm").submit(function(event) {

event.preventDefault（）不适用于click事件并自动提交表单

1 个答案: