I have this PHP application with Bootstrap 4 I am working on and I am trying to pop a toast in screen. For this I have to do: $('.toast').toast('show'); Code (JavaScript): The problem is that the JQuery include (along with BS include) is at the bottom of the page (therefore it's AFTER my BS/JQuery call and it causes the error: Uncaught ReferenceError: $ is not defined I figured that if I move my includes from the bottom to the top of the page the problem disappear but I have been told that for the sake of the new good coding practices I should keep them at the bottom. Said that how can I fix such issue? Thanks!
Yeah, I just figured it the worse way possible: struggling! Now there is something very weird happening to my project. I realized that in fact I have to keep a duplicate of all my JS stuff both in the top as well at the bottom of my pages otherwise it won't work. I am not sure if there is something to do but I am using CodeIgniter 4 and also all my pages are "broken" in three parts: a top template, the main body and a bottom template. This is the only way I found then everything works fine. This is SO weird.
Which is why jQuery is a steaming pile of ineptly developed trash. Hence the poor OP's problem with garbage scripting and nonsensical code orders. Big tip, if you're declaring scripting like that in the markup, you're doing it ALL WRONG. Good scripting should enhance markup AFTER it's been written, not be slopped into the middle of it. That you've double boned yourself with the train wreck of ignorance, incompetence, and ineptitude that is bootcrap is only further exacerbating your issues. All this framework garbage is just making you work harder, not smarter... If you think that bootstrap, jQuery, or any of the rest of such chazerei has made anything simpler, easier, or better you haven't learned enough HTML or CSS to even have an informed opinion on the topic, and ANYONE telling you to use these systems isn't qualified to flap their damned yap on the topic; being in desperate need of a quadruple helping of sierra tango foxtrot uniform. Bootstrap 4 and jQuery? You've been suckered. Throw the entire bloated overthought mess of ineptitude in the trash and start over vanilla. It'll save you time, effort, and headaches in the long run. I shudder to think what the actual page looks like.
the whole idea of javascript being at the bottom is so that the page loads before the javascript - everything should look ok without it. Now, there will be things that will be broken and not look right but hopefully your load times will be ok because you won't have bloat anywhere except the jquery & bootstrap. javascript shouldn't be on your page - so your code for your toast needs to be in a linked .js file that is loaded AFTER jquery.
@ncc1966 I don't use jquery, but try putting your jquery code inside <head> </head> section, and not outside it. And if you have to execute a function, put that call at the end of the jquery/js file itself, then doesn't matters where you include that file, the function call will be made only after the function has loaded and is defined. Why do you guys use jquery in the first place, specially when you are concerned about page load time etc? Doesn't it loads a big library code file, when you actually need only 3-4 functions out of it in your total webpage? How difficult is it to code those 4 functions in basic javascript?