ASP.NET MVC - jQuery document.ready() function not called

Question

I have a Razor view containing this script:

<script type="text/javascript">
    jQuery(function()
    {
        alert("hello world");
    })
</script>

The script doesn't open an alert Dialog when the page is loaded.

Portion of the BundleCfg:

bundles.Add(New ScriptBundle("~/bundles/jquery").Include(
            "~/Scripts/jquery-{version}.js",
            "~/Scripts/jquery.unobtrusive-ajax.js",
            "~/Scripts/jquery.validate.unobtrusive.js"))

bundles.Add(New ScriptBundle("~/bundles/jqueryval").Include(
            "~/Scripts/jquery.validate*"))

At the End of the Layout Body:

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required:=False)

there must be some problem with your registration of your bundle. — MaazKhan47
– MaazKhan47, Commented Nov 16, 2016 at 13:11
<script src="code.jquery.com/jquery-3.1.1.min.js" ></script> add this in your html file — MaazKhan47
– MaazKhan47, Commented Nov 16, 2016 at 13:14
What about this (function($) { $(document).ready(function() { // Code }); })(jQuery); — Belmin Bedak
– Belmin Bedak, Commented Nov 16, 2016 at 13:21

vscorp1991 · Accepted Answer · 2016-11-16 13:52:13Z

2

Try this

$(document).ready(function() {
    alert("hello world");
});

here is details: https://learn.jquery.com/using-jquery-core/document-ready/

Acording to link on top I realized that your code:

<script type="text/javascript">
    jQuery(function()
    {
        alert("hello world");
    });
</script>

is the same as this

<script type="text/javascript">
  $(document).ready(function() {
      alert("hello world");
  });
</script>

So problem was just about place where to render bundles.

edited Nov 16, 2016 at 13:52

answered Nov 16, 2016 at 13:08

vscorp1991

421 silver badge4 bronze badges

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

1 Comment

vscorp1991 Over a year ago

You should to declare @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryval") @Scripts.Render("~/bundles/bootstrap") before your JS. I put it in <head> tag of layout

party-ring · Accepted Answer · 2019-08-08 11:10:58Z

2

The problem is that the jQuery library is loaded after the symbol $ (jQuery) is called; that's why is doesn't work.

You have to put the line:

@Scripts.Render("~/bundles/jquery")

before the body is rendered.

edited Aug 8, 2019 at 11:10

party-ring

1,8811 gold badge21 silver badges45 bronze badges

answered Aug 8, 2019 at 10:09

Fernando José Galán

211 bronze badge

Comments

MaazKhan47 · Accepted Answer · 2016-11-16 13:08:15Z

0

Change your code with this.

$(document).ready(function () {
        alert("Hello World");
 });

answered Nov 16, 2016 at 13:08

MaazKhan47

8491 gold badge12 silver badges22 bronze badges

Collectives™ on Stack Overflow

ASP.NET MVC - jQuery document.ready() function not called

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related