required attribute is not working in html form

Question

I can't figure out why the required attribute seems to not be working even thought its inside the form tag, and I know my simple code seems to be okay. Is there anything I am missing or I should do to make this work?

 <form> <div class="form-group "> <label for="name"> Name :</label> <input type="text" class="form-control" id="name" required /> </div> <div class="form-group"> <label for="comment">Email :</label> <input type="text" class="form-control" id="comment" required /> </div> <div class="form-group"> <input type="button" id="submit" class="btn btn-xl" style="background:#169CF7;" value="Submit"> </div> </form> 

Answer 1

The test for required only runs when the form is submitted.

Your form doesn't have a submit button, so you can't submit it.

Add a submit button (or convert your type="button" to a submit button).

Answer 2

type="button" should be type="submit" instead. Then it will work.