disable form fields when submitting, re-enabling when we get a response

This commit is contained in:
Gered 2014-03-30 17:23:28 -04:00
parent 0d733381d5
commit 2b1be20cc8
2 changed files with 37 additions and 26 deletions

View file

@ -18,6 +18,7 @@ $(document).ready(function() {
e.preventDefault();
var form = $(this);
var fieldset = form.find('fieldset');
var params = {};
form.find('.form-control').filter('[data-fieldname]').each(function() {
@ -38,6 +39,8 @@ $(document).ready(function() {
errorContainer.html('');
errorContainer.hide();
fieldset.attr('disabled', true);
var url = context + 'api' + apiEndpoint + '?' + jQuery.param(params);
$.get(url)
.done(
@ -51,6 +54,8 @@ $(document).ready(function() {
textOutputContainer.text(data);
textOutputContainer.show();
}
fieldset.attr('disabled', null);
})
.fail(
function (response) {
@ -62,6 +67,8 @@ $(document).ready(function() {
response.responseText
);
errorContainer.show();
fieldset.attr('disabled', null);
});
})

View file

@ -1,4 +1,5 @@
<form class="form-horizontal api-form" role="form" id="textForm" data-api-endpoint="/text">
<fieldset>
<div class="form-group">
<label for="textText" class="col-sm-2 control-label">Text to Render</label>
<div class="col-sm-10">
@ -7,6 +8,7 @@
</div>
<div class="form-group">
<label for="textFont" class="col-sm-2 control-label">Font</label>
<div class="col-sm-3">
<select class="form-control" id="textFont" data-fieldname="font">
{% for font in fontNames %}
@ -17,6 +19,7 @@
</div>
<div class="form-group">
<label for="textFormat" class="col-sm-2 control-label">Format</label>
<div class="col-sm-3">
<select class="form-control" id="textFormat" data-fieldname="format">
<option>html</option>
@ -29,6 +32,7 @@
<button type="submit" class="btn btn-primary">Render To ASCII</button>
</div>
</div>
</fieldset>
</form>
<pre class="textOutputContainer" style="display: none;"></pre>