Question

I have a grid of buttons, lets say user opens up the grid and selects button “4”, it will display buttons “A” to “D” below (.answerBtns). Now if user enters in the number “3” in the “Number of Answers” text-box (#numberAnswerTxt), then if the user tries to select more than 3 buttons, it will come up with an alert stating you cannot go beyond limit, deselect a button. You can try this yourself.

But what I want to do is that lets say the user selects less buttons and lets say selects only 1 button when the user is suppose to select 3 buttons (user typed in number 3 in “Number of Answers” text-box), what I want is that if the user clicks on the “Add Question” button, it should display an alert saying “least buttons are selected, please select more buttons”. The alert should appear in the “insertQuestion(this.form)”.

How can this be done?

There are two functions to look at to help you and these are the last two functions in the javascript code which are:

function btnclick(btn)

and

function insertQuestion(form) 

Code is in Jsfiddle, click here

Answer 1

i think if you put this on insertQuestion(form) it will solve your problem

if ($('.answerBtnsOn').length != $('#numberAnswerTxt').val()) {
     alertErrors ="\nplease add more answer";  
}