How Can I add Custom javascript file in my laravel project?

Question

Can anyone please guide me regarding how can I add custom javascript in Laravel project?

I did google and found some steps but unable to figure out what the error is going on?

Steps I

Created a custom.js in my public folder with a simple function
add script tag in my app.blade.php
extends my layout

But the function is not working

$(document).ready(function()
{
    alert("hello this is test");
})

custom.js

enter code here

<script type="text/javascrip" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>"
<script type="text/javascript" src="{{asset('js/custom.js')}}"></script>

code I added in my main file app.blade

but when load my page it doesn't give me an alert. Alert is just for testing I tried with various function.

Have you tried viewing the source code from the web browser? — Chuksy
– Chuksy, Commented Sep 24, 2019 at 10:41
First of all thanks chusky for showing interest but yes I did and its showing but nothing working and one more thing If I am making a simple function without $document.ready like function check(){alert("example") and call it via on click function its working but when i use it by $(document).ready(function(){}) its not working — Samir Paruthi
– Samir Paruthi, Commented Sep 24, 2019 at 10:43
@SamirParuthi Hello, Can you check your browser console? If any error occurred. please shared with us. — Amit Senjaliya
– Amit Senjaliya, Commented Sep 24, 2019 at 10:48

Udhav Sarvaiya · Accepted Answer · 2019-09-24 11:10:03Z

3

You misspelled javascript
Remove the (") after writing the </script>

For Javascript:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript" src="{{ URL::asset('js/custom.js') }}"></script>

Make your directory structure is like this for JS: /public/js/custom.js

edited Sep 24, 2019 at 11:10

answered Sep 24, 2019 at 10:57

Udhav Sarvaiya

10.2k13 gold badges60 silver badges68 bronze badges

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

Comments

Amit Senjaliya · Accepted Answer · 2019-09-24 10:56:44Z

0

I have to review your code. I have found an error in your code like a spelling mistake.

<script type="text/javascript" 
 src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>"

You have miss t at the end of javascript.

answered Sep 24, 2019 at 10:56

Amit Senjaliya

2,9651 gold badge12 silver badges24 bronze badges

2 Comments

Amit Senjaliya Over a year ago

@SamirParuthi When use $(document).ready(function() you need to load jquery.min.js But wrong spelling privent load your js file.

Amit Senjaliya Over a year ago

@SamirParuthi Happy that I can solve your issue. please accept answer.

Collectives™ on Stack Overflow

How Can I add Custom javascript file in my laravel project?

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related