Django在用户更新表单后弹出消息(模态)

apeeds0o  于 2023-01-06  发布在  Go
关注(0)|答案(2)|浏览(114)

如果用户更新数据时弹出成功消息,我该怎么办?对于我的情况,用户更新数据后需要新建选项卡才能看到成功消息,我希望弹出消息而不是新建选项卡页面才能看到成功消息
我的html里有这个代码

<form method="post" action="/reactivate/" id="your-form"  enctype="multipart/form-data" autocomplete="on" class="btn btn-info  modal-ajax-load"
                        data-ajax-link="url"
                        data-toggle="modal"
                        data-modal-title="tilte"
                        data-target="#general_modal">{% csrf_token %}
                      {% for me in ako %}
                        Date: <input type="hidden" value="{{me.enddate}}" name="date" id="start_date">{{me.enddate}}

                        <input type="hidden" value="{{me.id}}" name="id" hidden><p>{{me.Email}}</p>

                    {% endfor %}
                    <select id="days">
                        {% for perfume in s %}
                            <option value="{{perfume.adddate}}" data-days="{{perfume.adddate}}" id="days">{{perfume.product}}  -  {{perfume.adddate}} Days</option>
                        {% endfor %}
                    </select>
                <br><br><br>
                <label>Deadline:</label><br>
                <input type="date" name="endate" id="end_date" readonly/>
                <input type="submit" value="Sign up" />
            </form>

<div id="general_modal" class="modal fade " >
      <div class="modal-dialog ">
        <div class="modal-content ">
          <div class="modal-header bg-info">
            <h6 class="modal-title">Info header</h6>
            <button type="button" class="close" data-dismiss="modal">&times;</button>
          </div>
          <div class="modal-body">
          <!-- Empty will be field by Js -->
          </div>
        </div>
      </div>
    </div>

这是我的剧本

<script>
$("#your-form").on('submit',function(e){
    e.preventDefault();
var ajax_link = this.getAttribute("data-ajax-link");
var target = this.getAttribute("data-target");
var title = this.getAttribute("data-modal-title");
var size = this.getAttribute("data-modal-size");
var bg = this.getAttribute("data-modal-content-bg");
// $(target+" .modal-body").load(ajax_link);
$.ajax({
    url:ajax_link,
    type:'POST',
    // data: $("#your-form-feilds").serialize(),

    success: function (response){
        $(target+" .modal-body").html(response);
    },
    /*
    error:function (response){
        new PNotify({
            title: 'oops',
            text:' Unable to load',
            type: 'error'
        });
    }
   */
});

$(target+" .modal-content").addClass(bg);
$(target+" .modal-title").html(title);
$(target+" .modal-dialog").removeClass().addClass("modal-dialog");
$(target+" .modal-dialog").addClass(size);
</script>

this is my views.py

def reactivate(request):
    id = request.POST.get('id')
    date = request.POST.get('endate')
    update = User.objects.get(id=id)
    update.enddate = date
    update.save()
    messages.info(request, 'Your data has been changed successfully!')
    return HttpResponse(json.dumps({"success":True}), content_type="application/json")
oipij1gg

oipij1gg1#

我也有同样的问题,我用奇怪的方法解决了它

id = request.POST.get('id')
date = request.POST.get('endate')
update = User.objects.get(id=id)
update.enddate = date
update.save()
print("dasdasd")
messages.info(request, 'Your Account has been changed successfully!')
obj = your_model.objects.filter(id=id)
s = obj.objects.all()
return render(request, 'myProfile.html', {"ako": ako, "s": s})

我没有使用任何脚本或jquery

{% if messages %}
  {% for msg in messages %}
    <div class="alert alert-info alert-dismissable">
      <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
      {{msg.message}}
    </div>
  {% endfor %}
{% endif %}
nbysray5

nbysray52#

面对同样的问题,问题很容易,此模态弹出窗口将在3秒内消失

    • 查看次数. py**
from django.contrib import messages
from .forms import ContactForm

def contact(request):
  if request.method == "POST":
    contact = ContactForm(request.POST)
    if contact.is_valid():
        contact.save()
        messages.success(request, 'Your Form has been Submitted Successfully')
        contact = ContactForm()
    else:
        messages.error(request, 'Invalid form submission.')

 else:
    contact = ContactForm()
 return render(request, 'home/index.html',{'form': contact})
    • 消息. html**
{% if messages %}
{% for message in messages %}
 <!-- Modal pop-up and auto close -->
   <div class="modal bg-muted fade" id="myModal" role="dialog">
     <div class="modal-dialog modal-dialog ">
       <!-- Modal content-->
       <div class="modal-content">
        <h5 class="modal-title">{{message}}</h5>
       </div>
     </div>
  </div>
     <script 
  src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"> 
  </script>
  <script 
     src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"> 
  </script>
      <script>
       $(document).ready(function(){
       $("#myModal").modal("show");
       setTimeout(function(){
       $('#myModal').modal('hide')
          }, 4000);
        });
    </script>
  {% endfor %}
  {% endif %}

在base.html文件中,按{% include 'messages.html'%}包含messages.html
就是这样。

相关问题