0

View

@extends('dashboard.app' , ['title'=>'Faculties'] )

@section('body')

    <div class="d-grid gap-2 d-md-flex justify-content-md-end ">
        <!-- Button trigger modal -->
        <button class="btn btn-outline-success me-md-2 rounded-pill" data-bs-toggle="modal"
                data-bs-target="#addBtn" style="width:80px;" type="button"> + Add
        </button>
    </div>
    <br>


    @if(session()->has('message'))

        @if(session('type') =='error')
            <div class="alert alert-light-danger alert-dismissible fade show" role="alert">
                {{ session('message') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"
                        aria-hidden="true"></button>
            </div>
        @endif

        @if(session('type') == 'success')
            <div class="alert alert-light-success alert-dismissible fade show" role="alert">
                {{ session('message') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"
                        aria-hidden="true"></button>
            </div>
        @endif
    @endif

    {!! $html->table([],true) !!}

    {{--Create Faculty Table --}}
{{--    <table class="table table-striped table-hover table-bordered col-12 shadow p-3 mb-5  rounded">--}}
{{--        <thead>--}}
{{--        <tr>--}}
{{--            <th scope="col" class="col-1"> SR NO</th>--}}
{{--            <th scope="col" class="col-6"> Faculty Name--}}
{{--                <span style="text-align:right;">--}}
{{--                           <i class="bi bi-arrow-up-circle-fill "--}}
{{--                              data-toggle="tooltip" data-placement="top" title="Sort Ascending order">--}}
{{--                           </i>--}}
{{--                           <i class="bi bi-arrow-down-circle-fill  "--}}
{{--                              data-toggle="tooltip" data-placement="top" title="Sort Descending order">--}}

{{--                           </i>--}}
{{--                        </span>--}}
{{--            </th>--}}
{{--            <th scope="col" class="col-1"> No Of Departments</th>--}}
{{--            <th scope="col" class="col-3" style="text-align: right;"> Actions &nbsp</th>--}}
{{--        </tr>--}}
{{--        </thead>--}}
{{--        <tbody>--}}
{{--        @foreach( $faculties as $faculty)--}}
{{--            <tr>--}}
{{--                --}}{{--                            <input type="hidden" class="deleteValueID" value="{{ $counter }}">--}}
{{--                <td scope="row"> {{ $faculty->id }} </td>--}}

{{--                --}}{{--                            <input type="hidden" class="deleteValue" value="{{ $faculty->name }}">--}}
{{--                <td class="overflow-hidden" data-toggle="tooltip" data-placement="top"--}}
{{--                    title="{{ $faculty->name }}">--}}
{{--                    {{ $faculty->name }}  </td>--}}
{{--                <td> {{ $faculty->departments->count() }} </td>--}}
{{--                <td class="d-md-flex justify-content-md-end ">--}}
{{--                    <button type="" class="btn btn-outline-success rounded-circle btn-sm"--}}
{{--                            data-toggle="tooltip" data-placement="top" title="Add Departments">--}}
{{--                        <i class="bi bi-file-plus"> </i></button>--}}
{{--                    &nbsp--}}

{{--                    <button type="" class="btn btn-outline-primary rounded-circle btn-sm editData"--}}
{{--                            data-bs-toggle="modal"--}}
{{--                            data-bs-target="#editModal"--}}
{{--                            data-toggle="tooltip"--}}
{{--                            data-placement="top"--}}
{{--                            title="Edit Faculty">--}}

{{--                        <i class="bi bi-pen"> </i></button>--}}
{{--                    &nbsp--}}
{{--                    --}}{{--                                <form action="{{  url('admin/faculties', $faculty->id) }}" method="post">--}}
{{--                    <form action="{{  route('faculties.destroy', $faculty->id) }}" method="post">--}}

{{--                        @csrf--}}
{{--                        @method('delete')--}}
{{--                        <button type="submit"--}}
{{--                                onclick="return confirm('Do you want to delete {{ $faculty->name }} ')"--}}
{{--                                class="btn btn-outline-danger rounded-circle btn-sm deletebtn"--}}
{{--                                data-toggle="tooltip" data-placement="top" title="Delete Faculty">--}}
{{--                            <i class="bi bi-trash"> </i></button>--}}
{{--                    </form>--}}
{{--                    &nbsp--}}

{{--                    <a href="{{ url('admin/faculties', $faculty->id) }}"--}}
{{--                       class="btn btn-outline-secondary rounded-circle btn-sm"--}}
{{--                       data-toggle="tooltip" data-placement="top" title="View">--}}
{{--                        <i class="bi bi-eye-fill"> </i> </a>--}}
{{--                </td>--}}
{{--            </tr>--}}
{{--        @endforeach--}}
{{--        </tbody>--}}
{{--    </table>--}}
    {{--    Faculty Table Ended        --}}
{{--    </div>--}}



@endsection

@push('scripts')
    {!! $html->scripts() !!}
@endpush

app

<!DOCTYPE html>
<html>
@include('dashboard.head_section', ['title' => "$title"])
<body class="bg-light">
<div class="row" id="app">

    @include('dashboard.navbar')

    <div class="col-10" id="main">

        <!-- header image and heading -->
        @include('dashboard.header')

        {{--       Main body of users list page started--}}
        <div class="card ">
            <div class="card-header">
                <h2 class="font-weight-bold" style="font-weight: bold;">{{ $title }}</h2>
            </div>
            <div class="card-body">
                @section('body')
                @show
            </div>

        </div>


    </div>
</div>

</body>
</html>

Controller

if (request()->ajax()) {
//        dd('test');
            return DataTables::of(Faculty::query())
                ->setRowClass(function ($faculty){
                    return $faculty->id % 2 == 0 ? 'alert-success' : 'alert-warning';
                })
                ->setRowId(function ($faculty){
                    return $faculty->id;
                })
                ->setRowAttr([
                    'align' => 'center'
                ])
                ->addColumn('action', '<button>kljsfd b</button>')
                ->editColumn('created_at', function($faculty){
                    return $faculty->created_at->diffForHumans();
                })
                ->editColumn('updated_at', function($faculty){
                    return $faculty->updated_at->diffForHumans();
                })
                ->make(true);
        }

        $html = $builder
            ->parameters([
                'searching' => true,
                'deferRender' => true,
                'scrollY' => true,
                'stateSave' => true,
                'pagingType' => 'full_numbers',
                'renderer' => 'bootstrap',
                'scrollCollapse' => true,
//                'search.search' => 'Fac'
                'fixedHeader.header' => true,
                'responsive' => true,
//                'scroller' => true,
//                'scrollY' => 450,
                'select' => true,
                'select.className' => 'alert alert-success',
                'select.blurable' => true,
//                'drawCallback' => 'function() { alert("Table Draw Callback") }',
//                'initComplete' => "function () {
//                            this.api().columns().every(function () {
//                                var column = this;
//                                var input = document.createElement(\"input\");
//                                $(input).appendTo($(column.footer()).empty())
//                                .on('keyup', function () {
//                                    column.search($(this).val(), false, false, true).draw();
//                                });
//                            });
//                        }",
            ])
            ->columns([
                ['data' => 'id', 'name' => 'id', 'title' => 'Sr. #'],
                ['data' => 'name', 'name' => 'name', 'title' => 'Name'],
                ['data' => 'created_at', 'name' => 'created_at', 'title' => 'Created At'],
                ['data' => 'updated_at', 'name' => 'updated_at', 'title' => 'Updated At'],
                ['data' => 'action', 'name' => 'action', 'title' => 'Action', 'orderable' => false, 'printable' => false],
            ]);

        return view('admin.faculties.index', compact('html'));

Page is visible table is rendering too but theres no ajax request

View

Head

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>STMS - {{ $title }} </title>
    <link rel="stylesheet" href="{{ asset('assets/bootstrap5/css/bootstrap.min.css') }}">
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>

    <script src="{{ asset('assets/bootstrap5/js/bootstrap.min.js') }}"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css">
    <link rel="stylesheet" href="{{ asset('assets/bootstrap5/custom.css') }}">
    <script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/datatables/datatables.min.css') }}">
    <script src="{{ asset('assets/datatables/datatables.min.js') }}"></script>

</head>

Same thing works on other project and on other page in same project...

Working one...

HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>HTML Builder</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>

    <script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>

    <link rel="stylesheet" type="text/css" href="{{ asset('assets/datatables/datatables.min.css') }}">
    <script src="{{ asset('assets/datatables/datatables.min.js') }}"></script>


</head>
<body>

<div class="container">
        @section('contents')
        @show
</div>

@stack('scripts')
</body>
</html>

@extends('test.app')

@section('contents')

    {!! $html->table([],true) !!}

@endsection

@push('scripts')
    {!! $html->scripts() !!}
@endpush

htmlBuilder

@extends('test.app')

@section('contents')

    {!! $html->table([],true) !!}

@endsection

@push('scripts')
    {!! $html->scripts() !!}
@endpush

Conrtoller is same

On same controller it works on one file but not on other file... I have tried to replace all js and bootstrap through CDN and copy pasted same of working one but same issue... it also do not give any error... enter image description here

Usman Khan
  • 56
  • 8

0 Answers0