js/app.js

Show us the code

You didn't give enough info to answer.

How are you adding datatables? Are you using npm to install it? Did you add it to the webpack.mix.js file? Did you run npm run dev to compile it? Tell us everything you are doing to use datatables... how you installed it, how you reference it in your views, the order that you are loading scripts in the views, etc.

It sounds like you might be using bootstrap for your css and dropdowns? That js is in the app.js file (by default, unless you removed it), so that's why your dropdowns aren't working if you didn't load app.js.

My apologies! don't want to waste anyone's time, I appreciate the help!! I installed it using yajra/laravel-datatables-oracle package. Installed it via Composer.

Controller:

namespace App\Http\Controllers;

use App\Http\Requests;
use App\User;
use Yajra\Datatables\Datatables;
use App\Listing;


class DatatablesController extends Controller
{
    /**
     * Displays datatables front end view
     *
     * @return \Illuminate\View\View
     */
    public function index()
    {
        return Datatables::of(Listing::query())->make(true);
    }

    /**
     * Process datatables ajax request.
     *
     * @return \Illuminate\Http\JsonResponse
     */
    public function admin()
    {
        return view('admin');
    }
}

Route:

        {
            Route::get('/admin', function () {
                return view('admin');
                });
            
            // get all items from DB
            //Route::get('/admin', 'ListingsController@getData');
            
           Route::get('admin', 'DatatablesController@admin');
            Route::get('index', 'DatatablesController@index');
           
        }
                      
                      
    );

balde:

<!-- Scripts -->
    <script src="{{ asset('js/app.js') }}" defer></script>

    <!-- Fonts -->
    <link rel="dns-prefetch" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css?family=Raleway:300,400,600" rel="stylesheet" type="text/css">

    <!-- Styles -->
    <link href="{{ asset('css/app.css') }}" rel="stylesheet">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    
    
        <link  href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>  
        <script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>


<table id="myTable" class="display table table-bordered table-striped table-hover" cellspacing="0" width="100%">        
                               
        <thead>
                                        <tr>
                                            <th>First Name</th>
                                            <th>Last Name</th>
                                            <th>Year Born</th>
                                            <th>Last 4 of SS</th>
                                            <th>School</th>
                                            <th>Module</th>
                                        </tr>
                                    </thead>
                                    
                               </table>
      
      <script>
         $(function() {
               $('#myTable').DataTable({
               processing: true,
               serverSide: true,
               ajax: '{{ url('index') }}',
               columns: [
                        { data: 'first_name', name: 'first_name' },
                        { data: 'last_name', name: 'last_name' },
                        { data: 'year_born', name: 'year_born' },
                        { data: 'last_four', name: 'last_four' },
                        { data: 'location', name: 'location' },
                        { data: 'module', name: 'module' }
                     ]
            });
         });
         </script>

I referencing Datatables via CDN and just running it on my one admin page without a blade template but including the js/app.js that is included in laravel makes it not work, but as soon as I take it out Datatables works great but no logout functionality since I removed the js/app.js . Anyone have any ideas I can try?

it is a common trap you would fall when you were new to laravel . laravel use webpack to compile all css and js files to app.css and app.js , if you want to import a new asset , import through npm or yarn , then run npm run dev to compile them down.

for example , if you wanna use jquery in laravel project , first , npm install jquery.

then , in your resource/assets/js/app.js file , add a line : import $ from 'jquery', compile , then good to go.

note that , resource/assets/js/app.js is not the same as public/js/app.js.

TY sir! That points me in the right direction!