loading CSS and JS files on specific views in Laravel 5.2

Question

I have CSS and JS files that must only load on certain very specific views in Laravel 5.2.

My boss decided to drop RequireJS which we used to load JS files on our blade templates. Now, we are trying to load dependencies on a native manner.

This is my code:

@extends('layouts.app')
<link href="{{ URL::asset('assets/css/slick.grid.css') }}" rel="stylesheet">
<link href="{{ URL::asset('assets/css/examples.css') }}" rel="stylesheet">
<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function() {
        loadscript('assets/js/jquery.event.drag-2.3.0.js');
        loadscript('assets/js/slick.rowselectionmodel.js');
        loadscript('assets/js/slick.core.js');
        loadscript('assets/js/slick.grid.js');
    });
</script>
@section('page')
//the rest of page

And my "loadscript" function does this:

function loadscript(url, callback)
{
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;

    head.appendChild(script);
};

This does work, but it feels quite slow, I believe there must be a much better way to have specific css and js file load with laravel on whichever view we want.

It's really important to have the css and js files load only on certain views.

stackoverflow.com/questions/30716599/…

Hector E.
– Hector E.

2016-11-08 18:55:49 +00:00
Commented Nov 8, 2016 at 18:55 — Hector E.
– Hector E., Commented Nov 8, 2016 at 18:55

Community · Accepted Answer · 2017-05-23 12:19:48Z

2

Laravel 5 - Add a stylesheet only if on a certain page/controller (page specific asset)

@extends('layouts.master')

@section('styles')
    <link href="{{asset('assets/css/custom-style.css')}}" />
@stop

edited May 23, 2017 at 12:19

CommunityBot

11 silver badge

answered Nov 8, 2016 at 18:58

Hector E.

1166 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Stanley Umeanozie · Accepted Answer · 2017-05-29 21:33:16Z

1

If you don't like the @section() idea and just want the dynamic scripts in one place, check out my detailed answer here:

Laravel 5 - Add a stylesheet only if on a certain page/controller (page specific asset)

In summary, using named routes:

<!-- In layout template -->
@if (in_array(Route::currentRouteName(), ['profile', 'register']))
    <script src="example.js"></script>
@endif

answered May 29, 2017 at 21:33

Stanley Umeanozie

4675 silver badges14 bronze badges

Collectives™ on Stack Overflow

loading CSS and JS files on specific views in Laravel 5.2

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related