Below I've added my full Index.cshtml code. In ajax call it's hitting to success method. but i'm not able to reload or refresh the table without page refresh.

The below code is simple while clicking the submit button for filters i'm calling SubmitFilter method it redirect to c# method there i'm storing the results in a JArray variable.. then trying to reload the table...

this is the sample output screen

I've tried these

$("#tblTransactions").DataTable().draw(); $("#tblTransactions").DataTable().ajax.reload();

But it's not working for me. please Let me know if you got any idea ..thanks in advance..

@page
@model IndexModel
@{
    Layout = "_Layout";
}
    
<script>
    $(document).ready(function () {
        $("#tblTransactions").DataTable();
   });
function SubmitFilter()
{

    var transactionNumb = $("#transactionNumber").val();
    var cardHolderName = $("#cardHolder").val();
    alert("SubmitFilter");
    $.ajax({
    type: "GET",
    url: "https://localhost:7197/Transactions?transaction_number="+transactionNumb+"&cardholder="+cardHolderName,
    contentType: "application/json; charset=utf-8",
    dataType: "html",
    success: function (data)
    {
      
    }
    });
}
</script>

 
       <a style="max-width: 100px;max-height: 40px;margin-left: 10px;" href="#" onclick="SubmitFilter();" class="btn btn-primary">SUBMIT</a>
  
    

<table id="tblTransactions" class="table table-bordered table-condensed table-striped table-hover">
    <thead>
        <th scope="col">Transaction No</th>
        <td scope="col">Type</td>
        <td scope="col">Status</td>
    </thead>
    <tbody>
    @foreach (dynamic transaction in @Model.Transactions)
    {

        <tr>
            <td>@transaction.transaction_number</td>
            <td>@transaction.type</td>
            <td>@transaction.status</td>
        </tr>
    }
    </tbody>
</table>