Ajax 表单未正确提交

Question

我有一个未正确提交的 Ajax 表单的下一个问题。我有 3 种形式，一种用于桌面，一种用于移动，还有一种位于模式内的形式。桌面版的第一个表格完美运行并通过 Cakephp 注册了我需要的所有数据。第二个是用于移动版本的，它显示一个错误，该错误来自我为使用 Jquery 进行错误处理而开发的函数。移动版表单和模态表单似乎都存在相同的问题。我通过 ajax 发送查询，但问题仍然存在，显示相同的错误。这是正确工作的表单的 Jquery 代码。

   $('#nueva_normalidad_form').on('submit', function(e){

    e.preventDefault();

    $('#errorMain').html('');

    var formContainer = $('#form_container');

    var errorArea = $('#errorMain');

    if(!validateDocApplication(errorArea)){

        return;

    }

    var data = $('#nueva_normalidad_form').serialize();

    var beforeSend = function () {

        $('#sendDataButton').attr("disabled", true);

    };

    var error = function (a) {

        $('#errorMain').html('<div class="alert alert-danger">' + info.txt + '</div>');

        return a;

    };

    var success = function(info) {

        info = $.parseJSON(info);

        if (info.id === 200) {

            formContainer.animate({

                display: "none"

            }, {

                duration: 600,

                complete: function () {

                    formContainer.css("display", "none");

                    $('div#successText').css("display", "block");

                }

            });

            $('#successText').animate({

                display: "block"

            }, {duration: 700,

                complete: function () {

                    $('#successText').css("display", "block");

                }

            });

            dataLayer.push({'eventcategory': 'Conversion', 'event': 'submitForm'});

        } else {

            $('#errorMain').html('<div class="alert alert-danger">' + error.txt + '</div>');

        }

    };

    saveNewNormDoctor(data, beforeSend, success, error);

});

Answer 1

最后，我找到了解决问题的方法。通过为我需要的每个输入字段分配新的 ID，我得到了这个函数：&nbsp; &nbsp;function validateDocApplicationForm(errorArea) {&nbsp; &nbsp; var noError = true;&nbsp; &nbsp; if(!$('#name_form').val()){&nbsp; &nbsp; &nbsp; &nbsp; errorArea.html('<div class="alert alert-danger">Por favor, inserte el nombre</div>');&nbsp; &nbsp; &nbsp; &nbsp; noError = false;&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; name = $('#name_form').val();&nbsp; &nbsp; &nbsp; &nbsp; return name;&nbsp; &nbsp; }&nbsp; &nbsp; if(!$('#surname_form').val()){&nbsp; &nbsp; &nbsp; &nbsp; errorArea.html('<div class="alert alert-danger">Por favor, inserte el apellido</div>');&nbsp; &nbsp; &nbsp; &nbsp; noError = false;&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; surname = $('#surname_form').val();&nbsp; &nbsp; &nbsp; &nbsp; return surname;&nbsp; &nbsp; }&nbsp; &nbsp; if(!$('#email_form').val()){&nbsp; &nbsp; &nbsp; &nbsp; noError = false;&nbsp; &nbsp; &nbsp; &nbsp; errorArea.html('<div class="alert alert-danger">Por favor, inserte su correo</div>');&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; email = $('#email_form').val();&nbsp; &nbsp; &nbsp; &nbsp; var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;&nbsp; &nbsp; &nbsp; &nbsp; noError = re.test(email);&nbsp; &nbsp; &nbsp; &nbsp; return email;&nbsp; &nbsp; }&nbsp; &nbsp; if(!$('#tel_form ').val()){&nbsp; &nbsp; &nbsp; &nbsp; errorArea.html('<div class="alert alert-danger">Por favor, inserte el número de teléfono</div>');&nbsp; &nbsp; &nbsp; &nbsp; noError = false;&nbsp; &nbsp; }else {&nbsp; &nbsp; &nbsp; &nbsp; phone = $('#tel_form').val();&nbsp; &nbsp; &nbsp; &nbsp; return phone;&nbsp; &nbsp; }&nbsp; &nbsp; if(!$('#collegiate_form').val()){&nbsp; &nbsp; &nbsp; &nbsp; errorArea.html('<div class="alert alert-danger">Por favor, inserte el número de colegiado</div>');&nbsp; &nbsp; &nbsp; &nbsp; noError = false;&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; colegiado = $('#collegiate_form').val();&nbsp; &nbsp; &nbsp; &nbsp; return colegiado;&nbsp; &nbsp; }&nbsp; &nbsp; var valorSpec = $('#spec_form option:selected').val();&nbsp; &nbsp; if(!valorSpec){&nbsp; &nbsp; &nbsp; &nbsp; errorArea.html('<div class="alert alert-danger">Seleccione una especialidad</div>');&nbsp; &nbsp; &nbsp; &nbsp; noError = false;&nbsp; &nbsp; }&nbsp;&nbsp; &nbsp; return noError;}我必须对我的标记进行的更改是：&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<div id="formNewnorm" class="bottom_margin">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col-md-12 col-sm-12 form-group top_margin no_side_paddings">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col-sm-6 col-md-6 no_padding_left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input name="name" id="name_form" class="desesc form-control" type="text"&nbsp; placeholder="<?= __('Nombre'); ?> *">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col-sm-6 col-md-6 no_side_paddings">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input name="surname" id="surname_form" class="desesc form-control" type="text"&nbsp; placeholder="<?= __('Apellidos'); ?> *">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input name="email" id="email_form" class="desesc form-control" type="email" placeholder="<?= __('e-mail');?> *">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input name="phone" id="tel_form" class="desesc form-control" type="number" placeholder="<?= __('Número de contacto');?> *">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <select class="desesc form-control" name="especialidad" id="spec_form">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="0"><?= __('Seleccione su especialidad'); ?></option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <?php foreach ($specs AS $k => $v) { ?>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="<?= $k; ?>"><?= $v; ?></option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <?php } ?>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </select>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input name="colegiado" id="collegiate_form" class="desesc form-control" type="number" placeholder="<?= __('Número de colegiado'); ?> *">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="radio radio_highlight">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="radio" name="condiciones_form" id="condiciones_form" value="1" required="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label class="text-primary" for="condiciones_form">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<?= __('He leído y acepto las');?> <a target="_blank" href="http://topdoctors.local/terminos-legales">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <u><?= __('Condiciones de Uso'); ?></u></a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="hidden" name="created" value="<?php echo date('Y-m-d H:i:s'); ?>" >&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="form-group">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div id="errorModal"></div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button id="sendDataButton" class="btn btn-block btn-primary btn_md">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <?= __('Solicitar información'); ?>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>通过这种方法，我能够使用各自的名称和新 ID 将值重新分配给每个输入。因此通过 ajax 请求传递新值，我能够将我的数据注册到数据库中。