Functional check of all empty text inputs is not performed

I have jsfiddle here http://jsfiddle.net/cbyJD/76

As you can see in the fiddle, there are 2 questions, but in question 1 it contains several text inputs, and question 2 contains only one text input. Now I'm trying to check for any empty text inputs, but the problem is that if in the first text input in question 1 I fill in the value and leave the rest empty when I press the submit button, since this other text input in question 1 is empty, it should display lert, stating that there is an error in question 1 stating that there is an empty text input. Well, it’s not, instead, it directly goes to display a warning for question 2, which says that there is an empty input in this question.

Therefore, it seems to me that the problem is that if the question has several input data, if one of these inputs is full, then it seems that this is good and that there are no empty text input errors in this question. This is clearly incorrect, since each individual input in the question must be filled, and not one text input can be empty.

How can I update the script to fix this problem?

The jQuery () validation function is here:

function validation() { var alertValidation = ""; var _qid = ""; var _msg = ""; $("[class*='q']").each(function(i) { var questions = parseInt($("[class*=q" + i + "_qnum]").text()); var txtinput = $("[class*=q" + i + "_mark]").val(); _qid = questions; _msg = "You have errors on Question Number: " + _qid + "\n"; if (txtinput == '') { alertValidation += "\n\u2022 You have not entered in a value in all the Indivdiaul Marks textbox\n"; } if (alertValidation != "") { return false; //Stop the each loop } }); if (alertValidation != "") { alert(_msg + alertValidation); return false; } return true; } 

The following is the HTML code:

 <form id="Marks" action="" method="post"> <table border='1' id='markstbl'> <thead> <tr> <th class='questionth'>Question No.</th> <th class='answermarksth'>Marks per Answer</th> </tr> </thead> <tbody> <tr class="questiontd"> <td class="questionnumtd q1_qnum" name="numQuestion" rowspan="2">1 <input type="hidden" name="q1_ans_org" class="q1_ans_org" value="5"><input type="hidden" name="q1_ans" class="q1_ans" value="5"></td> <td class="answermarkstd"> <input class="individualMarks q1_mark" q_group="1" name="answerMarks[]" type="text" onkeypress="return isNumberKey(event)" maxlength="3" /> </td> </tr> <tr class="questiontd"> <td class="answermarkstd"> <input class="individualMarks q1_mark" q_group="1" name="answerMarks[]" type="text" onkeypress="return isNumberKey(event)" maxlength="3" /> </td> </tr> <tr class="questiontd"> <td class="questionnumtd q2_qnum" name="numQuestion" rowspan="1">2 <input type="hidden" name="q2_ans_org" class="q2_ans_org" value="5"><input type="hidden" name="q2_ans" class="q2_ans" value="5"></td> <td class="answermarkstd"> <input class="individualMarks q2_mark" q_group="1" name="answerMarks[]" type="text" onkeypress="return isNumberKey(event)" maxlength="3" /> </td> </tr> </tbody> </table> <p><input id="submitBtn" name="submitMarks" type="submit" value="Submit Marks" /></p> </form> 

The table looks like this:

 Question No. Marks per Answer 1 (blank text input) (blank text input) 2 (blank text input) 
+4
source share
1 answer

I am updating your violin.

see this

 $("input[data-type='qmark']").each(function(i) { var questions = $(this).attr("data-qnum"); var marks = parseInt($("[class*=q" + i + "_ans_text]").text(), 10); var txtinput = $(this).val(); _qid = questions; _msg = "You have errors on Question Number: " + _qid + "\n"; 
+1
source

All Articles