Prevent submitting the form if invalid
This commit is contained in:
parent
430a6493f0
commit
645c217fbe
@ -17,10 +17,37 @@ export default {
|
||||
data: function() {
|
||||
return {
|
||||
selectedSection: this.initialSelectedSection,
|
||||
invalid: true,
|
||||
fields: {},
|
||||
}
|
||||
},
|
||||
|
||||
created: function() {
|
||||
this.$root.$on('field-mount', this.handleFieldMount)
|
||||
},
|
||||
|
||||
mounted: function() {
|
||||
this.$root.$on('field-change', this.handleChange)
|
||||
},
|
||||
|
||||
methods: {
|
||||
handleFieldMount: function(event) {
|
||||
const { name, optional } = event
|
||||
this.fields[name] = optional
|
||||
},
|
||||
|
||||
handleChange: function(event) {
|
||||
const { name, valid, parent_uid } = event
|
||||
this.fields[name] = valid
|
||||
this.validateForm()
|
||||
},
|
||||
|
||||
validateForm: function() {
|
||||
const valid = !Object.values(this.fields).some(field => field === false)
|
||||
this.invalid = !valid
|
||||
return valid
|
||||
},
|
||||
|
||||
toggleSection: function(sectionName) {
|
||||
if (this.selectedSection === sectionName) {
|
||||
this.selectedSection = null
|
||||
@ -28,5 +55,11 @@ export default {
|
||||
this.selectedSection = sectionName
|
||||
}
|
||||
},
|
||||
|
||||
handleSubmit: function(event) {
|
||||
if (this.invalid) {
|
||||
event.preventDefault()
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -108,7 +108,7 @@
|
||||
{% call ToggleSection(section_name="edit") %}
|
||||
<ul>
|
||||
<li class="accordion-table__item__expanded">
|
||||
<form action="{{ url_for('applications.update_environment', environment_id=env['id'], fragment='application-environments', _anchor='application-environments') }}" method="post">
|
||||
<form action="{{ url_for('applications.update_environment', environment_id=env['id']) }}" method="post" v-on:submit="handleSubmit">
|
||||
{{ edit_form.csrf_token }}
|
||||
{{ TextInput(edit_form.name, validation='requiredField') }}
|
||||
{{
|
||||
|
Loading…
x
Reference in New Issue
Block a user