@extends('essential.main', [
    'breadcum' => 'Post',
    'route' => 'post',
])

@section('content')
    <div class=" mt-2">
        @include('essential.buttons')
        <div class="flex flex-col w-full" id="post"></div>
    </div>
@endsection

@push('scripts')
    <script type='text/javascript'>

     $('#add_post').submit(function(e)   {
            e.preventDefault();
            var form_data = new FormData(this);
            $.ajax({
                type: "POST",
                url: "posts",
                data: form_data,
                cache: false,
                contentType: false,
                processData: false,
                dataType: "json",
                success: function(response) {
                    if (response.status == true) {
                        getDataTable();
                        toggleModal('modal-add');
                        $("#add_post")[0].reset();
                        toastr.success(response.message);
                    } else {
                        toastr.error(response.message);
                    }
                },
                error: function(response) {
                    console.log(response);
                }
            });
        });

        function getDataTable(page) {
            $.ajax({
                type: "GET",
                url: "posts" + "?page=" + page,
                data: {
                    _token: "{{ csrf_token() }}"
                },
                success: function(response) {
                    // toastr.success("Get Post Successfully");
                    $('#post').html(response);
                }
            });
        }
    
    </script>
@endpush


@section('extras')
@include('post.store')
@endsection