Trouble getting Django ModelForm inside modal to work - django

Question

OK - I'm positive that the issue is that I have some fundamental understanding of how forms work in Django, so 30,000 ft conceptual explanations are welcome, in addition to code fixes!
I'm trying to run my site from (mostly) a single view (and single template), with modal popups to view info (working) and to edit or add it (not working). I can see the form, fill it out, and click submit, at which point the modal closes, but no new Courses show up in the admin view.
I'll confine this to a single model - my simplest - for the time being:
models.py:
class Course(models.Model):
Name = models.CharField(max_length=30,unique=True)
Active = models.BooleanField(default=True)
def __unicode__(self):
return u'%s' % (self.Name)
views.py
def IndexView(request,Course_id,Section_id):
template_name = 'gbook/index.html'
print Course_id,Section_id
this_course = Course.objects.get(pk=Course_id)
active_courses = Course.objects.all().filter(Active=True).exclude(pk=Course_id)
section_list = Section.objects.all().filter(course=this_course)
if len(section_list) >1:
multi_section = True
else:
multi_section = False
active_section = Section.objects.get(pk=Section_id)
roster = Student.objects.all().filter(sections__in=[active_section])
announcement_list = Announcement.objects.all().filter(sections__in=[active_section])
courseaddform = CourseAddForm()
context = {'active_courses':active_courses, 'this_course': this_course,
'active_section':active_section, 'section_list':section_list,
'roster':roster, 'multi_section':multi_section,
'announcement_list':announcement_list, 'courseaddform':courseaddform}
return render(request,'gbook/index.html', context)
forms.py
class CourseAddForm(forms.ModelForm):
class Meta:
model = Course
fields = ['Name', 'Active']
templates/index.html
...
<li class="dropdown">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span><span class="caret"></span>
<ul class="dropdown-menu">
<li><a data-toggle="modal" data-target="#SectionRosterModal">Roster</a></li>
<li><a data-toggle="modal" data-target="#AnnouncementModal">Announcements</a></li>
<li><a data-toggle="modal" data-target="#CourseAddModal">CourseAdd</a></li>
</ul>
</li>
...
<!-- COURSE ADD MODAL -->
<div class="modal fade" id="CourseAddModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header" style="padding:5px 10px;">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4>Add Course</h4>
</div>
<div class="modal-body" style="padding:10px 10px;">
<form data-parsley-validate method="post" id="courseaddform" action="" enctype="multipart/form-data"
data-parsley-trigger="focusout">
{% csrf_token %}
{{ courseaddform.as_p }}
<p id="login-error"></p>
<input type="submit" class="btn btn-info submit" name="AddCourse" value="Add Course" />
</form>
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
...
I think that there's supposed to be a POST command in there somewhere, but I really don't have a good handle on the process here. Thanks for the help!

Answer 1

It looks like you are not doing anything with the form data when you post back, you need to process the form if the request method is a POST
def IndexView(request, ...):
if request.method == "GET":
... do what you are doing now and return
elif request.method == "POST":
cf = CourseAddForm(request.POST)
if cf.is_valid():
...do stuff with cf.cleaned_data <---- this is a dict
return ....
You are doing the same thing for GET and POST requests right now and neither deals with the submitted form
see here for more details
https://docs.djangoproject.com/en/1.10/topics/forms/#the-view
EDIT #1:
The POST should be a standard HTTP POST request back to the same URL. Just set the method tag as you are now and action="." (or a URL lookup in the template).
You need to return a valid HTTPResponse object but the normal case when dealing with a form is to return a HTTPResponseRedirect(...some url...) if the form is valid. In the case of a single page app, if you reload the same page you need to do everything you did in the request.method == "GET" so maybe return a HTTPResponseRedirect back to the same URL. In this case, I would look at the django messages framework and add a message to the context saying the form was submitted successfully and display the message in the reloaded page (you should always check if there is a message to display anyway when using the messages framework so this will not break the case where you are loading the page for the first time)
https://docs.djangoproject.com/en/1.9/ref/contrib/messages/