javascript - Hidden form field but to still show required validation if no set value -
i have form fields populated javascript based on how user interacts webpage.
<input type="hidden" class="evaluation_answer" required name="evaluation_1"/> <div class="options"> <div class="option"> <i class="fa fa-star-o fa-2x"></i> </div> <div class="option"> <i class="fa fa-star-o fa-2x"></i> </div> <div class="option"> <i class="fa fa-star-o fa-2x"></i> </div> <div class="option"> <i class="fa fa-star-o fa-2x"></i> </div> </div>
the value field gets populated javascript.
var stars = document.getelementsbyclassname("fa-star-o"); for(var = 0; < stars.length; i++) { stars[i].addeventlistener("click", function(){ console.log("empty star clicked..."); var sib = this.parentnode.parentnode; sib = sib.getelementsbytagname("i"); console.log(sib); for(var u = 0; u < sib.length; u++) { sib[u].classlist.remove("fa-star"); sib[u].classlist.add("fa-star-o"); sib[u].style.color = "#444"; } this.classlist.remove("fa-star-o"); this.classlist.add("fa-star"); for(var u = 0; u < sib.length; u++) { if(sib[u].classlist.contains("fa-star")) { var index = u; break; } } var hidden_input = this.parentnode.parentnode.parentnode; hidden_input = hidden_input.getelementsbyclassname("evaluation_answer"); hidden_input[0].value = index + 1;
this gives hidden input field value depending on index of whatever clicked on page (not important), however, should have not clicked in , still wish submit form, field have no value set. i've tried adding required tag hidden input field, validation popup/alert (chrome) doesn't show.
is there way show these required validation messages?
tl;dr: in chrome, required fields have not been given value alert user that field required upon submission, if set field hidden, doesn't show validation. fix?/workaround? know working intended, i'd prefer validation message.
Comments
Post a Comment