What should I do if jquery submit does not submit?

The solution to jquery submit not submitting: 1. Open the corresponding form code file; 2. Change the button type to submit; 3. Modify the button id.

The operating environment of this article: windows7 system, jquery version 3.2.1, DELL G3 computer

What should I do if jquery submit does not submit?

The solution to the problem that jquery submit() cannot submit the form

When I wrote the form submission today, I needed to add a confirmation prompt, so I did not use the submit button to submit. Change it Use jq's submit(), and then there is a problem

<form class="form-horizontal m-t" method="post" action="@Url.Action("Edit")" id="form">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>添加</h5>
                    </div>
                    <div class="ibox-content">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">开始时间：</label>
                            <div class="col-sm-8">
                                <span>
                                    @(Model.annualRate_beginDate?.ToString("yyyy-MM-dd"))
                                </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">结束时间：</label>
                            <div class="col-sm-8">
                                <input type="text" class="form-control" name="annualRate_endDate" id="annualRate_endDate" onclick="laydate({ istime: false, format: &#39;YYYY-MM-DD&#39; })" value="@Model.annualRate_endDate.ToString("yyyy-MM-dd")" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">年利息%：</label>
                            <div class="col-sm-8">
                                <input type="number" step="0.01" class="form-control" id="annualRate_rate" name="annualRate_rate" value="@Model.annualRate_rate.ToString("#0.00")" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-4 col-sm-offset-2">
                                <button class="btn btn-lg btn-primary" id="submit_btn" type="button">
                                    提交
                                </button>
                                <a class="btn btn-lg btn-white" href="@Url.Action("Index")">
                                    取消
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>

 1 <script type="text/javascript">
 2     $(function () {
 3         $("#submit").click(function () {
 4             var start = &#39;@(Model.annualRate_beginDate?.ToString("yyyy-MM-dd"))&#39;;
 5             var end = $("#annualRate_endDate").val();
 6             var val = $("#annualRate_rate").val();
 7             layer.confirm(&#39;请确认所填写的信息是否正确？<br/>开始时间：&#39; + start + &#39;<br/>结束时间：&#39; + end + &#39;<br/>年利率:&#39; + val, { icon: 3, title: &#39;提示&#39; }, function (index) {
 8                 $("#form").submit();
 9                 layer.close(index);
10             });
11         });
12     })
13 </script>

Click the submit button and a confirmation prompt will appear, but after confirmation, there will be no response

But if you change the button type to submit, you can submit again

So I went to jQuery API to find the reason, and I immediately understood when I saw the following text:

Additional Notes:
Forms and their child elements should not use input names or ids that conflict with properties of a form, such as submit, length, or method. Name conflicts can cause confusing failures. For a complete list of rules and to check your markup for these problems, see DOMLint.

It probably means that the form and its sub-elements should not use the attributes of a form as name or id. Names, such as submit, length, and method, etc., otherwise conflicts will occur, and name conflicts may cause this situation.

It turns out that the button id is set to submit

As long as you change the id, there will be no problem

Recommended learning: "jquery video tutorial 》

The above is the detailed content of What should I do if jquery submit does not submit?. For more information, please follow other related articles on the PHP Chinese website!