How to save a dynamically generated textbox value which is inside a jquery datatable to a database using ajax

See more:

Ajax

MVC

DataTable

Razor

Dear team i am trying to save a textbox value in db using ajax which is inside the jquery datatable . My Datatable is below

<script>
        $(document).ready(function () {
            var empid = '@ViewBag.empid';
            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: "/HRValidation/LoadInsuranceNominee",
                data: "id=" + empid,
                success: function (response) {
                    $('#insurancetable').dataTable({
                        data: response,
                        columns: [
                            {
                                "data": null,
                                "render": function (data, type, full, meta) {
                                    return '<input type="checkbox" name="chkSelect" id="' + full.employeeInsuranceId + '" value="' + full.employeeInsuranceId + '">';
                                }
                            },
                            { 'data': 'employeeInsuranceId' },
                            { 'data': 'employeeId' },
                            { 'data': 'insurance_Nomiee_Name' },
                            { 'data': 'insurance_Nomiee_Gender_Name' },
                            { 'data': 'insurance_Nomiee_Relationship_Name' },
                            { 'data': 'insurance_Nomiee_DOB_String' },
                            {
                                "data": null,
                                "render": function (data, type, full, meta) {
                                    return '<input type="text" name="nomineeTextbox_' + full.employeeInsuranceId + '" id="nomineeTextbox_' + full.employeeInsuranceId + '">';
                                }
                            }
                            
                        ],
                        //autofill: true,
                        //select: true,
                        //responsive: true,
                        //destroy: true,
                        //scrollY: true,
                        //scrollX: true,
                    })
                },
                error: function (error) {
                    console.log(response);
                }

            });
        });
    </script>

What I have tried:

This is my onclick save query

<div>
            <input type="submit" style="float:right;" value="Next" class="btn btn-primary" onclick="fnNExt()" />
            <button formnovalidate="formnovalidate" class="btn btn-primary" onclick="fnBack()" formmethod="get">Back</button>
        </div>

.

i am not sure what to do after this

<script>
        function fnNExt() {
            var data = $('#insurancetable').DataTable().rows().data();
            console.log(data);
            for (var i = 0; i < data.length; i++) {
                var employeeInsuranceId = data[i].employeeInsuranceId;
                var textboxValue = $('#nomineeTextbox_' + employeeInsuranceId).val();
                console.log()
                // Use an AJAX call to save the textbox value to the database
            }
        }
    </script>