0

我正在使用formvaladation.io进行 HTML 表单验证,当我按下提交按钮数据成功插入数据库时​​,我使用 ajax 保存数据,但是 JsonResponse()将 {'saved':1}之类的字典打印到网页而不是提供 javascript警报,然后我发现这件事发生是因为我使用了 formvalidation.io,当我不使用表单验证时,它工作正常并且 JsonResponse 将数据返回给 ajax 成功函数并在页面中提供 javascript 警报。

所以我认为表单验证javascript文件中有一些错误,我请求你在我的代码中提供进一步的帮助。

文件

<form method="post" id="patient">
{% csrf_token %}
          *** // All input tags are here i am not able to show it because there are many input box ***                  
   <div class="card-footer">
      <div class="d-flex justify-content-end">
          <input type="submit" class="btn btn-light-success btn-lg mr-2 font-weight-bold">
          <input type="reset" class="btn btn-light-danger btn-lg font-weight-bold">
      </div>
   </div>
</form>

来自 HTML 文件的 Ajax 调用

<script>
    $(document).on('submit', '#patient', function (e) {
        e.preventDefault();
        $.ajax({
            type: 'POST',
            url: '{% url 'Patient:add' %}',
            data: $("#patient").serialize()
            dataType: 'json',
            success: function (data) {
                if (data.saved === 1) {
                    alert("Data Saved");
                }
            }
        });
    });
</script>

患者验证.js 文件

var form = document.getElementById('patient');
document.addEventListener('DOMContentLoaded', function(e) {
    FormValidation.formValidation(
        document.getElementById('patient'),
        {
            fields: {
                name: {
                    validators: {
                        notEmpty: {
                            message: 'Patient name is required'
                        }
                    }
                },

                gender: {
                    validators: {
                        notEmpty: {
                            message: 'Please select an option'
                        }
                    }
                },

                age: {
                    validators: {
                        notEmpty: {
                            message: 'Patient age is required'
                        }
                    }
                },  
                ** // All other fields are here // **
            },

            plugins: { //Learn more: https://formvalidation.io/guide/plugins
                trigger: new FormValidation.plugins.Trigger(),
                // Bootstrap Framework Integration
                bootstrap: new FormValidation.plugins.Bootstrap(),
                // Validate fields when clicking the Submit button
                submitButton: new FormValidation.plugins.SubmitButton(),
                // Submit the form when all fields are valid
                defaultSubmit: new FormValidation.plugins.DefaultSubmit(),
            }
        }
    );
});

视图.py 文件

def add_patient(request):
    if request.method == 'POST':
        name = request.POST['name']
        gender = request.POST['gender']
        age = request.POST['age']

        add = Patient(name=name, gender=gender, age=age)
        add.save()

        data = {'saved': 1}
        return JsonResponse(data)
    else:
        return render(request, 'Patient_template/add_patient.html')
4

0 回答 0