I do not selected buttons to go back to being unselected if option changes

[malcolm_p]

I have a grid of buttons the user can select from by opening the grid and selecting a button. Now if the user selects a button from the grid then it displays buttons “A” to whatever letter depending on the option selected from the grid. Now lets say the user clicks on the “Select All Answers” buttons, all buttons from “A” to whichever button turns green. Now if user decides to select another option from the grid, then what happens is that all the buttons that have been selected turns back to being unselected (turns back to a white color).

I do not want this to happen. If the user clicks a button from the grid then I do not want it to remove all selected buttons underneath, I want it to stay the same as what it was.

I want the same if the user changes the value in the “Number of Answers” textbox, I do not want it to turn selected buttons to being unselected.

How can this be done?

Code is in Jsfiddle, Click here

[Paul_Wilkins]

@malcolm_p

I have a grid of buttons the user can select from by opening the grid and selecting a button. Now if the user selects a button from the grid then it displays buttons “A” to whatever letter depending on the option selected from the grid. Now lets say the user clicks on the “Select All Answers” buttons, all buttons from “A” to whichever button turns green. Now if user decides to select another option from the grid, then what happens is that all the buttons that have been selected turns back to being unselected (turns back to a white color).

I do not want this to happen. If the user clicks a button from the grid then I do not want it to remove all selected buttons underneath, I want it to stay the same as what it was.

I want the same if the user changes the value in the “Number of Answers” textbox, I do not want it to turn selected buttons to being unselected.

How can this be done?

You need to remove that fromCharCode line at the start of the for loop, and adjust the code so that’s it’s constantly checking for answerBtnsOn (and not answerBtnsOff)
That can be done by changing:
if ($(btn).hasClass(“answerBtnsOff”)) {
to
if (!$(btn).hasClass(“answerBtnsOn”)) {

Finally, if a value is in Number of Answers, you need to set it to the number of currently visible and selected answer buttons.