Как выйти из режима редактирования подключения из базы данных, не обновляя страницу?

Question

нужна ваша помощь по этому вопросу.

У меня есть 2 события щелчка, одно на столе для режима добавления и одна кнопка на другом столе для режима обновления.Эти два режима имеют одно входное свойство, оно меняет значение, когда я щелкаю по надстройке и обновлению.Моя проблема в режиме обновления, затем добавить событие щелчка, когда я (кнопка) отправляю добавленное значение, режим все еще находится на обновлении.Он изменяет существующее значение, не добавляя другое значение в базу данных.

Как мне выйти из режима обновления, чтобы уступить место режиму добавления?

<form method="post" id="api_crud_form">
    <h4 class="modal-title" id="h4">Add / Update Item</h4>
    <hr>
    <div class="row">
        <div class="col-md-1">

            <button type="submit" name="button_action" id="button_action-insert" class="btn btn-danger btn-sm form-control" value="Insert">Save</button>

            <button type="submit" name="button_action" id="button_action-update" class="btn btn-danger btn-sm form-control" value="Update">Update</button>

          <input type="hidden" name="product_id" id="product_id" />
          <input type="hidden" name="order_id" id="order_id" />
          <input type="text" name="tran_id" id="tran_id" value="<?php echo $tran_id; ?>" />
          <input type="hidden" name="tran_amount" id="tran_amount" />

            <input type="hidden" name="action" id="action" value="insert" />
        </div>
        <div class="col-md-2">
            <input type="text" name="tran_quantity" id="tran_quantity" placeholder="Enter Quantity here" autocomplete="off" class="input form-control" />
        </div>
        <div class="col-md-7">
            <input type="text" name="product_description" id="product_description" class="input form-control" readonly/>
        </div>
        <div class="col-md-2">
            <input type="text" name="product_price" style="text-align: right;" id="product_price" class="input form-control" readonly/>
        </div>
    </div>
    <hr>
</form>

Вот код JS

$('#api_crud_form').on('submit', function(event){
    event.preventDefault();

    if($('#tran_quantity').val() == '') {

        alert("Enter Quantity");
    } else if ($('#tran_quantity').val() == '0') {

        alert("Enter a valid number!");
    } else if ($('#product_description').val() == '') {

        alert("You have not selected an item yet.");
    } else if ($('#product_price').val() == '') {

        alert("You have not selected an item yet.");
    } else {

        var form_data = $(this).serialize();
        $.ajax({
            url:"action.php",
            method:"POST",
            data:form_data,
            success:function(data) {

                fetch_data();
                $('#api_crud_form')[0].reset();
                $('#apicrudModal').modal('hide');
                if(data == 'insert') {
                    alert("Item inserted successfully!");
                }

                if(data == 'update') {
                    alert("Item updated successfully");
                }
            }
        });
    }
});