Adding condition to when change event occurs on radio buttons

This commit is contained in:
Max 2022-02-14 17:11:53 -05:00
parent 56cda31f8c
commit 781a1f8967
9 changed files with 24 additions and 23 deletions

View file

@ -19,7 +19,7 @@
:textPosition="textPosition"
:isMultiSelect="isMultiSelect"
:groupName="groupName"
:loaderEnabled="loaderEnabled"
:selectingInitiatesLoad="selectingInitiatesLoad"
:loaderColor="loaderColor"
:loaderPosition="loaderPosition"
:sizeInRem="sizeInRem"
@ -31,7 +31,6 @@
screenReaderOnlyText="(opens new window)"
:colLength="this.answers.length < 3 ? '' : '-4'"
:selectedButtonIDs="selectedValues"
:newPageOnSelect="isOverflowScrollable"
data-test="button"
/>
</div>
@ -61,7 +60,7 @@ export default {
type: String,
default: "text-center",
},
loaderEnabled: Boolean,
selectingInitiatesLoad: Boolean,
loaderColor: {
type: String,
default: "blue",

View file

@ -2,11 +2,11 @@
<buttonQuestion
class="radioQuestion"
isOverflowScrollable
selectingInitiatesLoad
:questionText="questionText"
:answers="makes"
groupName="Choose Vehicle Make"
textPosition="text-start"
:loaderEnabled="true"
v-model="selectedValueAsArray"
isRequired=true
/>

View file

@ -2,11 +2,11 @@
<buttonQuestion
class="radioQuestion"
isOverflowScrollable
selectingInitiatesLoad
:questionText="questionText"
:answers="models"
groupName="Choose Vehicle Model"
textPosition="text-start"
:loaderEnabled="true"
v-model="selectedValueAsArray"
isRequired=true
/>

View file

@ -2,11 +2,11 @@
<buttonQuestion
class="radioQuestion"
isOverflowScrollable
selectingInitiatesLoad
:questionText="questionText"
:answers="styles"
groupName="Choose Vehicle Style"
textPosition="text-start"
:loaderEnabled="true"
v-model="selectedValueAsArray"
isRequired=true
/>

View file

@ -2,11 +2,11 @@
<buttonQuestion
class="radioQuestion"
isOverflowScrollable
selectingInitiatesLoad
:questionText="questionText"
:answers="years"
groupName="Choose Vehicle Year"
textPosition="text-start"
:loaderEnabled="true"
v-model="selectedValueAsArray"
isRequired=true
/>

View file

@ -91,7 +91,7 @@ describe("list-button-horizontal.vue", () => {
// Act
const wrapper = shallowMount(listButtonHorizontal, {
propsData: {
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});
@ -113,7 +113,7 @@ describe("list-button-horizontal.vue", () => {
const wrapper = shallowMount(listButtonHorizontal, {
propsData: {
loaderColor: "blue",
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});
@ -135,7 +135,7 @@ describe("list-button-horizontal.vue", () => {
const wrapper = shallowMount(listButtonHorizontal, {
propsData: {
loaderPosition: "right",
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});
@ -157,7 +157,7 @@ describe("list-button-horizontal.vue", () => {
const wrapper = shallowMount(listButtonHorizontal, {
propsData: {
sizeInRem: 1,
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});

View file

@ -12,7 +12,7 @@
:aria-required="isRequired"
:data-focus-target="groupName"
v-model="checkValue"
@change="handleCheckChange"
@change="!selectingInitiatesLoad ? handleCheckChange : ''"
/>
<label
tabindex="-1"
@ -60,7 +60,7 @@ export default {
buttonLabelSubCopy: String,
screenReaderOnlyText: String,
textPosition: String,
loaderEnabled: Boolean,
selectingInitiatesLoad: Boolean,
loaderColor: String,
loaderPosition: String,
sizeInRem: [Number, String],
@ -88,8 +88,9 @@ export default {
this.isLoaderDisplayed = true;
},
handleClick(value) {
if (this.loaderEnabled) {
if(this.selectingInitiatesLoad) {
this.displayLoader();
this.handleCheckChange();
}
this.handleChange(value);
},

View file

@ -91,7 +91,7 @@ describe("list-button.vue", () => {
// Act
const wrapper = shallowMount(listButton, {
propsData: {
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});
@ -113,7 +113,7 @@ describe("list-button.vue", () => {
const wrapper = shallowMount(listButton, {
propsData: {
loaderColor: "blue",
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});
@ -135,7 +135,7 @@ describe("list-button.vue", () => {
const wrapper = shallowMount(listButton, {
propsData: {
loaderPosition: "right",
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});
@ -157,7 +157,7 @@ describe("list-button.vue", () => {
const wrapper = shallowMount(listButton, {
propsData: {
sizeInRem: 1,
loaderEnabled: true,
selectingInitiatesLoad: true,
},
});

View file

@ -12,7 +12,7 @@
:aria-required="isRequired"
:data-focus-target="groupName"
v-model="checkValue"
@change="!newPageOnSelect ? handleCheckChange : ''"
@change="!selectingInitiatesLoad ? handleCheckChange : ''"
>
<label
tabindex="-1"
@ -63,7 +63,7 @@ export default {
textPosition: String,
buttonLabelSubCopy: String,
screenReaderOnlyText: String,
loaderEnabled: Boolean,
selectingInitiatesLoad: Boolean,
loaderColor: String,
loaderPosition: String,
sizeInRem: [Number,String],
@ -73,7 +73,6 @@ export default {
default: "",
},
selectedButtonIDs: [Array, String],
newPageOnSelect: Boolean,
},
data() {
return {
@ -91,8 +90,10 @@ export default {
this.isLoaderDisplayed = true;
},
handleClick(value) {
this.loaderEnabled ? this.displayLoader() : '';
this.newPageOnSelect ? this.handleCheckChange() : '';
if(this.selectingInitiatesLoad) {
this.displayLoader();
this.handleCheckChange();
}
this.handleChange(value);
},
handleCheckChange(newValue, oldValue){