Empty (val) html field with ajax and enter next value in this field from database

I am working on a student management system, which is why I have so many fields in my HTML form, including the following

• Student ID
• Paper number
• Assessment

HTML FORM

Ajax is used to send data to the form, so I would like to see the form is submitted to empty (val) student id field and fill the student id field with next student id from MySQL

, as well as field Val Score.

My problem is how to fill the student id field with the following value from MySQL.

If this is not submitted via Ajax, I would just fetch and repeat the next value from the MySQL database.

Below is the Ajax am am code to submit the form

<script type="text/javascript">
    $(document).ready(function() {
        $("#keyingForm").submit(function() {
            $("#loading").slideDown();
                 var frm = $('#keyingForm');
                 $.ajax({
                     type: frm.attr('method'),
                     url: 'scoring.php',
                     data: frm.serialize(),
                     success: function (data) {
                         $('#loadData').html(data);
                         $("#loading").slideUp();
               }, error: function(jqXHR, textStatus, errorThrown){
              console.log(" The following error occured: "+ textStatus, errorThrown );
            } });
           return false;
        });
    });     
</script>

      

        
        
        
      

    

Student id studentid

and grade for field scoreid

I hope this makes sense as I am not very good at Ajax or JavaScript, thanks for your hand.