Issue in usage of datatable in Laravel 10

Dear Friends, I am using Laravel 10 form with datatables for listing data in onchange of dropdown. Shows data correctly but the navigation link shows incorrect as shown

my javascript part is

 $(document).ready(function() {

        // ...................... Data Table ......................

        new DataTable('#itemtypeTable');
        
        $('#dt-length-0').next().remove("label");
        $("#dt-search-0").prev("label").remove();
        $('#dt-search-0').attr("placeholder", "Search");
      

        // Call filterData when department, office category, organization, or level selection changes
        $('#department, #officecategory, #organization, #level').change(function() {
           
            filterData();
        });

        // Initial call to filterData to populate table based on default selections
        //filterData();
    });

    function updatePaginationControls(response) {
    // Update current page and total pages
    $('#current-page').text(response.current_page);
    $('#total-pages').text(response.last_page);
   
    // Enable/disable previous and next buttons based on current page
    if (response.current_page == 1) {
        $('#prev-page').prop('disabled', true);
    } else {
        $('#prev-page').prop('disabled', false);
    }

    if (response.current_page == response.last_page) {
        $('#next-page').prop('disabled', true);
    } else {
        $('#next-page').prop('disabled', false);
    }

    // Remove links from pagination controls
    $('.pagination-links').remove();
}

    function filterData() 
        {

            var department = $('#department').val();
            var officeCategory = $('#officecategory').val();
            var organization = $('#organization').val();
            var level = $('#level').val();

            $.ajax({
                url: '{{ route("officefilterData") }}',
                type: 'GET',
                data: {
                    department: department,
                    officecategory: officeCategory,
                    organization: organization,
                    level: level
                },
               
                success: function(response) {
    $('#itemtypeTable').empty(); // Clear existing table rows

    var slno = (response.current_page - 1) * response.per_page + 1; // Calculate initial serial number value
    response.data.forEach(function(item) {
        $('#itemtypeTable').append('<tr><td>' + slno + '</td><td>' + item.office_name + '</td><td>' + item.department_name + '</td><td>' + item.category_name + '</td><td>' + item.level + '</td><td>' + (item.contact ? (item.mobile + ' / ' + item.contact) : item.mobile) + '</td><td>' + item.email + '</td></tr>');
        slno++;
    });

    // Update pagination controls
    updatePaginationControls(response); // Update pagination controls
},

                error: function(xhr, status, error) {
                    console.error(error);
                    // Show error message
                    alert('Error occurred while fetching data. Please try again later.');
                }
            });
        }

my controller function as

public function officefilterData(Request $request) {
        $department = $request->input('department');
        $officeCategory = $request->input('officecategory');
        $organization = $request->input('organization');
        $level = $request->input('level');
    
        $offices =  DB::table('dam.offices')
                    ->join('dam.mt_departments', 'dam.mt_departments.dept_id', '=', 'dam.offices.department')
                    ->join('dam.mt_office_levels', 'dam.mt_office_levels.level_id', '=', 'dam.offices.level')
                    ->join('mt_office_categories', 'mt_office_categories.ofc_cat_id', '=', 'dam.offices.office_category')
                    ->select('dam.offices.department','dam.offices.office_category', 'dam.offices.office_id', 'dam.offices.office_name' ,
                        'dam.mt_office_levels.level' ,'dam.offices.mobile','dam.offices.contact','dam.offices.email',
                        'dam.mt_departments.department_name','dam.mt_office_categories.category_name'
                    );
    
        if ($department) {
            $offices->where('dam.offices.department', $department);
        }
        if ($officeCategory) {
            $offices->where('dam.offices.office_category', $officeCategory);
        }
        if ($organization) {
            $offices->where('dam.offices.office_id', $organization);
        }
        if ($level) {
            $offices->where('dam.offices.level', $level);
        }
    
        // Paginate the results
        $perPage = 10; // Change this as per your requirement
        $officeList = $offices->paginate($perPage);
    
        // Return the paginated data
        return response()->json($officeList);
    }

How to solve this issue ?

Please advise

Thanks

Anes P A