<script src="/js/plugins/chosen/chosen.jquery.js"></script>
<script src="/js/plugins/select2/select2.full.min.js"></script>
<link rel="stylesheet" href="/css/plugins/dataTables/fixedHeader.dataTables.min.css">
<script src="/js/plugins/dataTables/datatables.min.js"></script>

<script>

    $(document).ready(function () {
        $('.chosen-select').chosen({ width: "100%" }).change(function () {
            $(this).closest('.form-group').next().find('input').focus();
        });

        $.fn.serializeObject = function () {
            var obj = {};

            $.each(this.serializeArray(), function (i, o) {
                var n = o.name, v = o.value;

                obj[n] = obj[n] === undefined ? v
                    : $.isArray(obj[n]) ? obj[n].concat(v)
                        : [obj[n], v];
            });

            return obj;
        };

        var table = $('.footable').DataTable({
            scrollCollapse: false,
            scrollX: false,
            scrollY: false,
            "processing": true,
            "serverSide": true,
            paging: true,
            "pageLength": 25,
            lengthMenu: [
                [25, 50, 100, 200],
                ['25', '50', '100', '200']
            ],
            columnDefs: [
                { orderable: false, targets: ['_all'] }
            ],
            "aaSorting": [],
            "dom": '<"top">rt<"bottom"flp><"clear">',
            "bAutoWidth": true,
            "bFilter": true,
            "bLengthChange": false,
            "searching": false,
            fixedHeader: {
                header: true,
            },
            "ajax": {
                "url": "{{ route('member-hosted-meetings-data') }}",
                "dataType": "json",
                "type": "POST",
                data: { host_id:$("#host_id").val() },
            },
            "columns": [
                { "data": "id" },
                { "data": "user_email" },
                { "data": "month" },
                { "data": "meetings_count" },
                { "data": "average_duration" },
            ]

        });


    });


</script>