Updates to AJAX forms and adding autofill function to the event form when adding things via AJAX

This commit is contained in:
Tom Price
2014-12-03 11:17:07 +00:00
parent fbee8c9e9a
commit 91f6bb5557
8 changed files with 81 additions and 37 deletions

View File

@@ -34,7 +34,6 @@
$(document).ready(function () {
{% if not object.pk and not form.errors %}
$('.form-hws').slideUp(function () {
$('.form-is_rig').slideUp();
});
@@ -111,11 +110,9 @@
data-target="{{ form.person.id_for_label }}"/>
</div>
<div class="col-xs-3 align-right">
<button type="button" class="btn btn-default"
data-url="{#% url invoiceitem_add object.pk %#}"
data-toggle="modal" data-target="#itemModal">
<a href="{% url 'person_create' %}" class="btn btn-default modal-href" data-target="#{{ form.person.id_for_label }}">
<span class="glyphicon glyphicon-plus"></span>
</button>
</a>
</div>
</div>
</div>
@@ -138,11 +135,9 @@
data-target="{{ form.organisation.id_for_label }}"/>
</div>
<div class="col-xs-3 align-right">
<button type="button" class="btn btn-default"
data-url="{#% url invoiceitem_add object.pk %#}"
data-toggle="modal" data-target="#itemModal">
<a href="{% url 'organisation_create' %}" class="btn btn-default modal-href" data-target="#{{ form.organisation.id_for_label }}">
<span class="glyphicon glyphicon-plus"></span>
</button>
</a>
</div>
</div>
</div>
@@ -199,11 +194,9 @@
data-target="{{ form.venue.id_for_label }}"/>
</div>
<div class="col-xs-3 align-right">
<button type="button" class="btn btn-default"
data-url="{#% url invoiceitem_add object.pk %#}"
data-toggle="modal" data-target="#itemModal">
<a href="{% url 'venue_create' %}" class="btn btn-default modal-href" data-target="#{{ form.venue.id_for_label }}">
<span class="glyphicon glyphicon-plus"></span>
</button>
</a>
</div>
</div>
</div>

View File

@@ -7,7 +7,7 @@
<div class="col-sm-offset-1 col-sm-10">
<h3>{{ object.pk|yesno:"Edit,Add" }} Organisation</h3>
<form action="{{ form.action }}" method="post" class="form-horizontal">{% csrf_token %}
<form action="{{ form.action|default:request.path }}" method="post" class="form-horizontal">{% csrf_token %}
<div class="row">
<div class="col-md-6">
{% include 'form_errors.html' %}

View File

@@ -7,10 +7,10 @@
<div class="col-sm-offset-1 col-sm-10">
<h3>{{ object.pk|yesno:"Edit,Add" }} Person</h3>
<form action="{{ form.action }}" method="post" class="form-horizontal">{% csrf_token %}
<form action="{{ form.action|default:request.path }}" method="post" class="form-horizontal">{% csrf_token %}
<div class="row">
{% include 'form_errors.html' %}
<div class="col-md-6">
{% include 'form_errors.html' %}
<div class="form-group">
<label for="{{ form.name.id_for_label }}"
class="col-sm-2 control-label">{{ form.name.label }}</label>

View File

@@ -7,7 +7,7 @@
<div class="col-sm-offset-1 col-sm-10">
<h3>{{ object.pk|yesno:"Edit,Add" }} Venue</h3>
<form action="{{ form.action }}" method="post" class="form-horizontal">{% csrf_token %}
<form action="{{ form.action|default:request.path }}" method="post" class="form-horizontal">{% csrf_token %}
<div class="row">
<div class="col-md-6">
{% include 'form_errors.html' %}

View File

@@ -69,18 +69,28 @@ class PersonCreate(generic.CreateView):
model = models.Person
def get_success_url(self):
return reverse_lazy('person_detail', kwargs={
'pk': self.object.pk,
})
if self.request.is_ajax():
url = reverse_lazy('closemodal')
messages.info(self.request, "modalobject="+serializers.serialize("json", [self.object]))
else:
url = reverse_lazy('person_detail', kwargs={
'pk': self.object.pk,
})
return url
class PersonUpdate(generic.UpdateView):
model = models.Person
def get_success_url(self):
return reverse_lazy('person_detail', kwargs={
'pk': self.object.pk,
})
if self.request.is_ajax():
url = reverse_lazy('closemodal')
messages.info(self.request, "modalobject="+serializers.serialize("json", [self.object]))
else:
url = reverse_lazy('person_detail', kwargs={
'pk': self.object.pk,
})
return url
class OrganisationList(generic.ListView):
@@ -107,18 +117,28 @@ class OrganisationCreate(generic.CreateView):
model = models.Organisation
def get_success_url(self):
return reverse_lazy('organisation_detail', kwargs={
'pk': self.object.pk,
})
if self.request.is_ajax():
url = reverse_lazy('closemodal')
messages.info(self.request, "modalobject="+serializers.serialize("json", [self.object]))
else:
url = reverse_lazy('organisation_detail', kwargs={
'pk': self.object.pk,
})
return url
class OrganisationUpdate(generic.UpdateView):
model = models.Organisation
def get_success_url(self):
return reverse_lazy('organisation_detail', kwargs={
'pk': self.object.pk,
})
if self.request.is_ajax():
url = reverse_lazy('closemodal')
messages.info(self.request, "modalobject="+serializers.serialize("json", [self.object]))
else:
url = reverse_lazy('organisation_detail', kwargs={
'pk': self.object.pk,
})
return url
class VenueList(generic.ListView):
@@ -145,18 +165,28 @@ class VenueCreate(generic.CreateView):
model = models.Venue
def get_success_url(self):
return reverse_lazy('venue_detail', kwargs={
'pk': self.object.pk,
})
if self.request.is_ajax():
url = reverse_lazy('closemodal')
messages.info(self.request, "modalobject="+serializers.serialize("json", [self.object]))
else:
url = reverse_lazy('venue_detail', kwargs={
'pk': self.object.pk,
})
return url
class VenueUpdate(generic.UpdateView):
model = models.Venue
def get_success_url(self):
return reverse_lazy('venue_detail', kwargs={
'pk': self.object.pk,
})
if self.request.is_ajax():
url = reverse_lazy('closemodal')
messages.info(self.request, "modalobject="+serializers.serialize("json", [self.object]))
else:
url = reverse_lazy('venue_detail', kwargs={
'pk': self.object.pk,
})
return url
class SecureAPIRequest(generic.View):
@@ -189,7 +219,9 @@ class SecureAPIRequest(generic.View):
# Response format where applicable
format = request.GET.get('format', 'json')
fields = request.GET.get('fields', None).split(',')
fields = request.GET.get('fields', None)
if fields:
fields = fields.split(",")
# Supply data for one record
if pk:

Binary file not shown.

View File

@@ -138,9 +138,17 @@
jQuery(document).ready(function () {
jQuery(document).on('click', '.modal-href', function (e) {
e.preventDefault()
modaltarget = jQuery(this).data('target')
modalobject = "";
jQuery('#modal').load(jQuery(this).attr('href'), function (e) {
jQuery('#modal').modal();
});
jQuery('#modal').on('hide.bs.modal', function(e) {
if(modaltarget != "" && modalobject != "") {
jQuery(modaltarget).val(modalobject[0]['pk']);
jQuery(modaltarget+'-input').val(modalobject[0]['fields']['name']);
}
})
});
});
</script>

View File

@@ -1,4 +1,4 @@
<div class="modal-dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
@@ -10,5 +10,16 @@
<div class="modal-footer">
{% block footer %}{% endblock %}
</div>
<script>
$('.modal-content form').on('submit', function(e) {
e.preventDefault();
data = $(this).serialize();
action = $(this).attr('action');
console.log(action)
$.post(action, data, function(resp) {
$('#modal').html(resp);
});
});
</script>
</div>
</div>