pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bind other input value properly and clear it when checkbox is toggled

Browse Source
This commit is contained in:
Montana 2019-01-04 10:59:12 -05:00
parent 62ac2642ae
commit 2743bddf0c
2 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
js/components/multi_checkbox_input.js
View File

@ -31,7 +31,8 @@ export default {
showError: showError,
showValid: !showError && !!this.initialValue,
validationError: this.initialErrors.join(' '),
otherChecked: this.initialValue.includes("other") ? true : this.otherChecked
otherChecked: this.initialValue.includes("other") ? true : this.otherChecked,
otherText: this.initialOtherValue
}
},
@ -54,6 +55,7 @@ export default {
},
otherToggle: function() {
this.otherChecked = !this.otherChecked
this.otherText = ''
}
}
}

4
templates/components/multi_checkbox_input.html
View File

@ -7,7 +7,7 @@
inline-template
{% if field.errors %}v-bind:initial-errors='{{ field.errors | list }}'{% endif %}
{% if field.data and field.data != "None" %}v-bind:initial-value="{{ field.data }}"{% endif %}
{% if other_input_field.data and other_input_field.data != "None" %}v-bind:initial-other-value="{{ other_input_field.data }}"{% endif %}
{% if other_input_field.data and other_input_field.data != "None" %}initial-other-value="{{ other_input_field.data }}"{% endif %}
key='{{ field.name }}'>
<div
v-bind:class="['usa-input', { 'usa-input--error': showError, 'usa-input--success': showValid }]">
@ -38,7 +38,7 @@
<label for='{{ field.name }}-{{ field.choices.index(choice) }}'>{{ choice[1] }}</label>
<div v-show="otherChecked">
<input type='text' name='{{ field.name}}_other' id='{{ field.name }}-other' value="{{ other_input_field.data }}" aria-expanded='false' />
<input type='text' name='{{ field.name}}_other' id='{{ field.name }}-other' v-bind:value="otherText" aria-expanded='false' />
</div>
{% endif %}
</li>