django-bootstrap5表单验证错误未显示

mitkmikd  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(229)

我有一个模态的表单需要验证。因为django在modals中的表单处理得不太好,我没有在文章之后呈现视图,而是使用ajax/js来确定行为。我无法显示无效的反馈div,即使我遵循了说明以下内容的文档:
对于无效字段,请确保使用aria DescripteBy将无效反馈/错误消息与相关表单字段相关联(注意,如果字段已指向其他表单文本,则此属性允许引用多个id)。
此外,我可以在控制台上查看“aria descripeby”属性在输入中的设置是否正确。

index.html

  1. <div class="modal-body">
  2. <form class="needs-validation" id="address_form" method="post" novalidate>
  3. {% csrf_token %}
  4. <div class="mb-3 row">
  5. <label for="id_applicantStreet1" class="col-sm-4 col-form-label">Address Line 1</label>
  6. <div class="col-sm-8">
  7. {{form.applicantStreet1}}
  8. </div>
  9. <div class="invalid-feedback" id="invalid-street1">This is required</div>
  10. </div>
  11. .....
  12. some more other form fields below

index.js

  1. $("#address_submit").click(function(){
  2. $.ajax({
  3. type: 'POST',
  4. data: $("#address_form").serialize(),
  5. url: '/ajax/validate_address_modal',
  6. success: function(data){
  7. if(data.status == 200){
  8. window.location.reload(true);
  9. } else {
  10. responseObj = data.form;
  11. for (const key in responseObj){
  12. var id_selector = "#id_"+ key;
  13. var message = "";
  14. for (let i = 0; i < responseObj[key].length; i++){
  15. message = responseObj[key][i] + "<br>" + message;
  16. }
  17. //$(id_selector).next().append(message);
  18. $(id_selector).attr("aria-describedby", "invalid-street1");
  19. $(id_selector).addClass("is-invalid");
  20. }
  21. }
  22. }
  23. });

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题