How to save data values from JQuery to PHP

Question

This is a Javascript file that creates new table row when add new button is clicked however I have no Idea on how to save data coming from the HTML file passed on the JQuery going into the database

$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
var actions = $("table td:last-child").html();
// Append table with add row form on add new button click
$(".add-new").click(function(){
    $(this).attr("disabled", "disabled");
    var index = $("table tbody tr:last-child").index();
    var row = 
    '<tr id="tables" onload="add()">' +
        '<td><input type="text" class="form-control" name="studentID" id="studentID"></td>' +
        '<td><input type="text" class="form-control" name="lastname" id="lastname"></td>' +
        '<td><input type="text" class="form-control" name="firstname" id="firstname"></td>' +
        '<td><input type="text" class="form-control" name="middleInitial" id="middleInitial"></td>' +
        '<td><input type="text" class="form-control" name="course" id="course"></td>' +
        '<td><input type="text" class="form-control" name="section" id="section"></td>' +
        '<td><input type="text" class="form-control" name="studentNo" id="studentNo"></td>' +
        '<td><input type="text" class="form-control" name="schoolYear" id="schoolYear"></td>' +
        '<td><input type="text" class="form-control" name="existingViolation" id="existingViolation"></td>' +
        '<td><input type="text" class="form-control" name="existingCommunityService" id="existingCommunityService"></td>' +
        '<td><input type="text" class="form-control" name="existingCommunityServicetime" id="existingCommunityServiceTime"></td>' +
        '<td><input type="text" class="form-control" name="remainingCommunityServicetime" id="remainingCommunityServiceTime"></td>' +
        '<td>' + actions + '</td>' +
    '</tr>';
    $("table").append(row);     
    $("table tbody tr").eq(index + 1).find(".add, .edit").toggle();
    $('[data-toggle="tooltip"]').tooltip();
    
    

});



// Add row on add button click

$(document).on("click", ".add", function(){
    let empty = false;
    let input = $(this).parents("tr").find('input[type="text"]');
    input.each(function(){
        if(!$(this).val()){
            $(this).addClass("error");
            empty = true;
            
        } else{
            $(this).removeClass("error");
        }
    
    });
    $(this).parents("tr").find(".error").first().focus();
    
    if(!empty){
        input.each(function(){
            var array =  [$(this).val()]
            array.push
            $(array.push).parent('td').html(array.push)
            console.log(array)
            localStorage.setItem('result', (array));
            console.log(localStorage.getItem('result'))
        });         
        $(this).parents("tr").find(".add, .edit").toggle();
        $(".add-new").removeAttr("disabled");
    
    }});



$(document).on("click", ".edit", function(){        
    $(this).parents("tr").find("td:not(:last-child)").each(function(){
        $(this).html('<input type="text" class="form-control" value="' + $(this).text() + '">');
    });     
    $(this).parents("tr").find(".add, .edit").toggle();
    $(".add-new").attr("disabled", "disabled");
});
// Delete row on delete button click
$(document).on("click", ".delete", function(){
    $(this).parents("tr").remove();
    $(".add-new").removeAttr("disabled");
});

});

There is a row that adds the value but never been saved into the database I know how to incorporate from HTML to PHP by using form action but JQuery is a different level for me so can you help me please? THANK YOU!