javascript - 提交按钮未提交表单，因为我有 2 个带有 ajax 请求的按钮

问题描述

我有一个带有自己的提交按钮的表单，并且该表单内有一个具有属性type=button, onclick=somefunction()的按钮..带有 onclick 的按钮运行良好，但另一个按钮根本没有提交。
我已确保具有单击功能的按钮具有，type=button而其他按钮具有type=submit
这是我的代码：
{% extends 'base/base.html' %}
{% block content %}

    <!-- Page Content -->
    <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <!-- page content -->
                <br><br>

                <h3>إنشاء فاتورة بيع جديدة </h3>
                <br><br>
                {% if messages %}
                    <ul class="messages">
                        {% for message in messages %}
                            <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
                        {% endfor %}
                    </ul>
                {% endif %}
                <form method='post' autocomplete="off" action=".">
                    {% csrf_token %}
                    <div class="autocomplete" style="width:100%">
                        <b>هاتف العميل </b><br>
                        {{ create_sell_invoice.client }}
                        <br>
                        <p style="display: none;" id="shown_name">
                            client name
                        </p>
                        <div id="add_new_client" style="margin:25px;padding: 25px;display: none;">
                            <form method='POST'>
                                {% csrf_token %}
                                <small style="color:rebeccapurple;">يمكنك إضافة عميل جديد برقم هاتف جديد</small>
                                <br><br>
                                <b>إسم الطالب</b>
                                {{ add_client_from_invoice_form.student_name }}
                                <br><br>
                                <b>ولى الامر</b>
                                {{ add_client_from_invoice_form.parent_name }}
                                <br><br>
                                <b>العنوان</b>
                                {{ add_client_from_invoice_form.address }}
                                <br><br>
                                <b>الهاتف</b>
                                {{ add_client_from_invoice_form.phone1 }}
                                <br><br>
                                <b>المستوى</b>
                                {{ add_client_from_invoice_form.level }}
                                <br><Br>
                                <button type="button" class="btn btn-success form-control" onclick="sendingRequest()">
                                    إضافة
                                </button>
                            </form>
                        </div>
                    </div>
                    <b id="id_delivery_title">التوصيل </b><br>
                    {{ create_sell_invoice.delivery }}
                    <br><br>
                    <b id="id_delivery_price_title">تكلفة التوصيل </b><br>
                    {{ create_sell_invoice.delivery_price }}
                    <br><br>
                    <b id="id_delivery_notes_title">ملاحظات على التوصيل </b><br>
                    {{ create_sell_invoice.delivery_notes }}
                    <br><br>
                    <button type="submit" id='ok_button' class="btn btn-primary form-control" disabled>موافق</button>
                    <br><Br><Br>
                </form>
                <script>
                    function sendingRequest() {
                        const studentName = document.getElementById('studentName');
                        const parentName = document.getElementById('parentName');
                        const clientAddress = document.getElementById('clientAddress');
                        const clientPhone = document.getElementById('clientPhone');
                        const clientLevel = document.getElementById('clientLevel');
                        $.ajax({
                            url: '/add/new/client/from/invoice/normal/invoice_sell_add/' + studentName.value + '/' + parentName.value + '/' + clientAddress.value + '/' + clientPhone.value + '/' + clientLevel.value + '/',
                            type: "POST",
                            data: {name: 'name', age: 'age'},
                            success: function (response) {
                                const add_new_client = document.getElementById('add_new_client');
                                add_new_client.setAttribute('style', 'margin:25px;padding: 25px;display: none;')
                                window.location.reload();
                            },
                            complete: function () {
                            },
                            error: function (xhr, textStatus, thrownError) {
                            }
                        });
                    }
                </script>

                <!-- /.col-lg-12 -->
            </div>
        </div>

    </div>
    <!-- /.row -->
    </div>
    <!-- /#page-wrapper -->

    </div>
    <datalist id="mylist">
        {% for item in clients %}
            <option>{{ item }}</option>
        {% endfor %}
    </datalist>
    {% for item in clients %}
        {{ item }}
    {% endfor %}
    <!-- ajax -->
    <script>
        $("#id_client").change(function () {
            var number = $(this).val();

            $.ajax({
                url: '/ajax/getting_client_name/',
                data: {
                    'number': number
                },
                dataType: 'json',
                success: function (data) {
                    const shown_name = document.getElementById('shown_name'),
                        ok_button = document.getElementById('ok_button'),
                        add_new_client = document.getElementById('add_new_client');
                    if (data.client_name) {
                        shown_name.setAttribute('style', 'display:block;color: blue;');
                        shown_name.innerHTML = data.client_name;
                        ok_button.disabled = false;
                        add_new_client.setAttribute('style', 'margin:25px;padding: 25px;display: none;background-color: #d3e4ec;');
                        $('#id_delivery').fadeIn();
                        $('#id_delivery_title').fadeIn();
                        $('#id_delivery_price').fadeIn();
                        $('#id_delivery_price_title').fadeIn();
                        $('#id_delivery_notes').fadeIn();
                        $('#id_delivery_notes_title').fadeIn();
                        if (data.client_name === 'رقم الهاتف غير صحيح') {
                            shown_name.setAttribute('style', 'display:block;color: red;');
                            ok_button.disabled = true;
                            add_new_client.setAttribute('style', 'margin:25px;padding: 25px;display: block;background-color: #d3e4ec;');
                            $('#id_delivery').fadeOut();
                            $('#id_delivery_title').fadeOut();
                            $('#id_delivery_price').fadeOut();
                            $('#id_delivery_price_title').fadeOut();
                            $('#id_delivery_notes').fadeOut();
                            $('#id_delivery_notes_title').fadeOut();
                        }
                    }
                }
            });

        });
    </script><!-- end of ajax -->
{% endblock %}
问题出在这行代码中
<button type="submit" id='ok_button' class="btn btn-primary form-control" disabled>موافق</button> 点击时按钮什么都不做
标签： javascripthtmlajaxdjango
javascript - 提交按钮未提交表单，因为我有 2 个带有 ajax 请求的按钮

问题描述

解决方案

推荐阅读
