I created an application to do date filtering, so when the date was changed the table will reload. It's working fine before, until I tried to add the export button (excel export using phpspreadsheet) with the form tag. When I change the date, the table doing infinite reload like this picture until I'm doing any click.

I think there's no problem with the controller code. The export function is working fine too, the problem just why the table doing infinite reload when I added the form tag.

Ajax code:

<script type="text/javascript">
    $(document).ready(function() {
        var table = $('#table').DataTable({
            "serverSide": true,
            "ajax": {
                url: "<?= base_url('user/pagination') ?>",
                type: "POST",
                data: {
                    start: function() {
                        return $('#start').val()
                    },
                    end: function() {
                        return $('#end').val()
                    }
                },
            },
        });

        $('#start, #end').on('keyup change', function(e) {
            table.ajax.reload(); // I used this to reload the table when the date changed
        });
    });
</script>

Html form

<label>Date Filter</label>
<form action="<?php echo base_url('user/export'); ?>" method="POST" targets="_blank">
    <div class="form-group col-md-6 form-float">
        <input type="date" name="start" id="start" class="form-control">
        <input type="date" name="end" id="end" class="form-control">
        <input type="submit" class="form-control" value="Export Data to Excel">
    </div>
</form>

Any solutions for it? or there's some alternative way to added my export button? Thanks!