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.