python - How to put a django form on a bootstrap modal with another form on the same page (outside the modal)? -
i've tried build website using django & bootstrap, , in 1 of pages have 2 forms, 1 add comment post, , other make contact me, contact form on bootstrap modal. how can put contact form in modal, function-based view?
views.py
def gameview(request, slug): game = gameupload.objects.get(slug=slug) comment_form = commentform() contact_form = contactform() if request.method == "post": if request.post['form-type'] == u'comment-form': comment_form = commentform(request.post) if comment_form.is_valid(): instance = form.save(commit=false) instance.upload = game instance.save() else: contact_form = contactform(request.post) #send mail me context = {"game": game, "comment_form": comment_form, "contact_form": contact_form, "comments": game.comment_set.all().order_by("-date")} return render(request, 'game.html', context) the template
<div class="jumbotron"> <div class="container"> <div class="col-sm-8 col-sm-offset-2"> <h3><i class="fa fa-comment"></i> add comment:</h3> <form method="post"> {% csrf_token %} {{ comment_form|crispy }} <input type="hidden" name="form-type" value="comment-form" /> <input type="submit" value="submit" class="btn btn-primary" /> </form> </div> </div> </div> the modal:
<div id="contact" class="modal fade" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">contact me</h4> </div> <div class="modal-body"> <form method="post" action="/"> {% csrf_token %} {{ contact_form|crispy }} <input type="hidden" name="form-type" value="contact-form" /> </form> </div> <div class="modal-footer"> <input type="submit" value="send" class="btn btn-success" /> <button type="button" class="btn btn-primary" data-dismiss="modal">close</button> </div> </div> </div> </div>
model submit button should within form tag
<div id="contact" class="modal fade" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">contact me</h4> </div> <div class="modal-body"> <form method="post" action="/"> {% csrf_token %} {{ contact_form|crispy }} <input type="hidden" name="form-type" value="contact-form" /> <!--- here --- > <input type="submit" value="send" class="btn btn-success" /> </form> </div> <div class="modal-footer"> <!-- line here --> <button type="button" class="btn btn-primary" data-dismiss="modal">close</button> </div> </div> </div> </div>
Comments
Post a Comment