При отправке он добавляет строку с неопределенными данными. Как я могу проверить форму при отправке?

Как проверить форму?

Я хочу представить. Он не добавляет строку и не отправляет.

$(document).ready(function() {
  $("#form-submit").on('click', function(e) {
    e.preventDefault();

    var formdata = {
      first_name: $("#first-name").val(),
      last_name: $("#last-name").val(),
      middle_name: $("#middle-name").val(),
      gender: $('input[name = "gender"]:checked').attr('value'),
      birthday: $("#birthday").val()
    }

    $("#student_data").append('<tr></tr>');
    $.each(formdata, function(key, value) {
      $('table tr:last').append('<td> ' + value + ' </td>');
    });
    $('table tr:last').append('<button class = "dlt" href = "#">Delete </button>  <button class = "edit" href = "#"> edit</button>')
    $("#demo-form1")[0].reset();
  });
});