我正在使用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')