bike/workstand
1
0
Fork 0
mirror of https://github.com/fspc/workstand.git synced 2025-10-31 08:25:35 -04:00
Code Issues Projects Releases Wiki Activity

Disable form until valid. (#42)

Browse Source
This commit is contained in:
Drew Larson 2017-05-01 19:35:03 -06:00 committed by GitHub
parent 2f9db5bf32
commit 989f9ffb85
2 changed files with 22 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
bikeshop_project/registration/templates/edit_member_form.html
View File

@ -4,7 +4,8 @@
{% block scripts %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<script>
dateOfBirthInput = document.getElementById('{{ form.date_of_birth.id_for_label }}');
var dateOfBirthInput = document.getElementById('{{ form.date_of_birth.id_for_label }}');
var submitButton = document.getElementById('submit');
dateOfBirthInput.addEventListener('blur', function(event) {
var input = event.target;
@ -23,6 +24,16 @@
}
});
var form = document.getElementsByTagName('form')[0];
var inputs = Array.prototype.slice.call(document.getElementsByTagName('input'));
var textAreas = Array.prototype.slice.call(document.getElementsByTagName('textarea'));
for (var el of inputs.concat(textAreas)) {
el.addEventListener('change', function() {
submitButton.disabled = !form.checkValidity()
})
}
</script>
{% endblock %}
@ -220,7 +231,7 @@
</div>
<div class="mdl-grid">
<div class="mdl-cell">
<button id="submit" type="submit"
<button disabled id="submit" type="submit"
class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--colored">
Save</button>
</div>

9
bikeshop_project/registration/templates/member_form.html
View File

@ -25,6 +25,15 @@
var waiverCheckBox = document.getElementById('{{ form.waiver_substitute.id_for_label }}');
var submitButton = document.getElementById('submit');
var form = document.getElementsByTagName('form')[0];
var inputs = Array.prototype.slice.call(document.getElementsByTagName('input'));
for (var anInput of inputs) {
anInput.addEventListener('change', function() {
submitButton.disabled = !form.checkValidity()
})
}
var requiredCheckboxes = function() {
return waiverCheckBox.checked;
};