Added AjaxUpdateView class

Also cleaned up the modal form javascript
This commit is contained in:
Oliver 2018-04-26 08:18:53 +10:00
parent 99743c6bd0
commit 55e7f365df
4 changed files with 68 additions and 29 deletions

View File

@ -39,7 +39,7 @@ class AjaxView(object):
class AjaxCreateView(AjaxView, CreateView):
def post(self, request):
def post(self, request, *args, **kwargs):
if request.is_ajax():
form = self.form_class(request.POST)
@ -55,9 +55,39 @@ class AjaxCreateView(AjaxView, CreateView):
return self.renderJsonResponse(request, form, data)
else:
return super(CreateView, self).post(request)
return super(CreateView, self).post(request, *args, **kwargs)
def get(self, request):
def get(self, request, *args, **kwargs):
response = super(CreateView, self).get(request, *args, **kwargs)
if request.is_ajax():
form = self.form_class(initial=self.get_initial())
return self.renderJsonResponse(request, form)
else:
return response
class AjaxUpdateView(AjaxView, UpdateView):
def post(self, request, *args, **kwargs):
if request.is_ajax():
form = self.form_class(request.POST)
data = {'form_valid': form.is_valid()}
if form.is_valid():
obj = form.save()
return self.renderJsonResponse(request, form, data)
else:
return super(UpdateView, self).post(request, *args, **kwargs)
def get(self, request, *args, **kwargs):
response = super(CreateView, self).get(request)
@ -67,4 +97,4 @@ class AjaxCreateView(AjaxView, CreateView):
return self.renderJsonResponse(request, form)
else:
return response
return super(UpdateView, self).get(request, *args, **kwargss)

View File

@ -19,7 +19,9 @@
<td><a href="{% url 'part-detail' sub_part.id %}">{{ sub_part.name }}</a></td>
<td>{{ sub_part.description }}</td>
<td>{{ bom_item.quantity }}</span></td>
<td><a href="{% url 'bom-item-detail' bom_item.id %}">Edit</a></td>
<td>
<button type='button' class='btn btn-success'>Edit</button>
</td>
</tr>
{% endwith %}
{% endfor %}
@ -31,4 +33,10 @@
</a>
</div>
{% endblock %}
{% block javascript %}
<script type='text/javascript' src="{% static 'script/modal_form.js' %}"></script>
{% endblock %}

View File

@ -37,7 +37,11 @@
<script type="text/javascript">
$(document).ready(function () {
bindModalForm('#modal-cat', '.js-create-cat', "{% url 'category-create' %}");
$(".js-create-cat").click(function() {
launchModalForm("#modal-cat", "{% url 'category-create' %}");
});
//bindModalForm('#modal-cat', '.js-create-cat', "{% url 'category-create' %}");
});
</script>

View File

@ -1,28 +1,25 @@
/* Bind a button to launch a modal form and handle AJAX requests */
function bindModalForm(modal, button, url, data) {
$(button).click(function () {
$.ajax({
url: url, // Where to request the data from
type: 'get', // GET request
data: data, // Any additional context data (e.g. initial values)
dataType: 'json',
beforeSend: function() {
$(modal).modal('show');
},
success: function(response) {
if (response.html_form) {
var target = modal + ' .modal-content';
$(target).html(response.html_form);
} else {
alert('JSON response missing form data');
$(modal).modal('hide');
}
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Error requesting form data:\n' + thrownError);
function launchModalForm(modal, url, data) {
$.ajax({
url: url, // Where to request the data from
type: 'get', // GET request
data: data, // Any additional context data (e.g. initial values)
dataType: 'json',
beforeSend: function() {
$(modal).modal('show');
},
success: function(response) {
if (response.html_form) {
var target = modal + ' .modal-content';
$(target).html(response.html_form);
} else {
alert('JSON response missing form data');
$(modal).modal('hide');
}
});
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Error requesting form data:\n' + thrownError);
$(modal).modal('hide');
}
});
$(modal).on('submit', '.js-modal-form', function() {