locked
refering .js files RRS feed

  • Question

  • User527076549 posted

    Hi ,

    I have this doubt , though i have referred the below js file in _Layout.cshtml, i was getting Javascript run-time error "$" is undefined.

    But again i referred same script in page error is resolved .So i wanted to know how this referring works

    <script src="~/Scripts/jquery-1.10.2.min.js"></script> 
    
    Thursday, December 20, 2018 10:38 AM

All replies

  • User197322208 posted

    Do not use

    $

    before loading 

    <script src="~/Scripts/jquery-1.10.2.min.js"></script>

    That's the idea why 

    @RenderSection("Scripts", required: false)

    exists.

    Read more at: https://docs.microsoft.com/en-us/aspnet/core/mvc/views/layout?view=aspnetcore-2.2 ( applices to MVC also)

    Thursday, December 20, 2018 2:19 PM
  • User1520731567 posted

    Hi amithashenoy,

    For example:

    View:

    ...html tags...

    @section scripts { <script>
    $(document).ready(function () { alert('1111');
    }
    </script> }

    Generally,the default template in layout has this line:

    @RenderSection("scripts", required: false)

    When you define an @section somewhere, lets say the _Layout.cshmtl file,

    it allows all of your Views to dynamically insert script files or CSS files or what ever into places in the defining page.

    This is very nice when, for example, you are using the jquery.treetable.js control only on a couple views in your site.

    So you may not want to globally include the jquery.treetable.js script file in your _Layout.cshtml since you are only going to need it on 2 or 3 pages.

    @section allows you to include those files only for certain views.

    It is needed since, a view cannot easily change the contents of the _Layout.cshtml otherwise.

    though i have referred the below js file in _Layout.cshtml, i was getting Javascript run-time error "$" is undefined.

    According to your description,you have a jquery library in Layout.cs,like:

    <script src="~/Scripts/jquery-1.7.1.min.js"></script>
    ...
    @RenderSection("scripts", required: false)

    For example,if you run the Index action,

    the Compiler will check whether the Index view references Layout.cs.

    If there is no @section scripts{},this view cannot call all reference packages from Layout.cs.

    So, it reports error "$" is undefined.

    But again i referred same script in page error is resolved .So i wanted to know how this referring works

    But if you add the below js file in Index View:

    <script src="~/Scripts/jquery-1.10.2.min.js"></script> 

    This js file will work for this View.

    Best Regards.

    Yuki Tao

    Friday, December 21, 2018 3:12 AM
  • User527076549 posted

    actually , it did not clear my doubt.

    index file able to refer other script  .js , .css file ,had issue only with this particular  js file 

    <script src="~/Scripts/jquery-1.7.1.min.js"></script>
    Wednesday, December 26, 2018 10:06 AM
  • User-271186128 posted

    Hi amithashenoy,

    actually , it did not clear my doubt.

    index file able to refer other script  .js , .css file ,had issue only with this particular  js file 

    <script src="~/Scripts/jquery-1.7.1.min.js"></script>

    As we all know, when adding the JavaScript/JQuery script, we need to make sure we have already loaded the JQuery reference first, and the reference should be in the front of our JQuery script.

    Like this:

    @*JQuery reference*@
    <script src="~/Scripts/jquery-1.10.2.min.js"></script>
    @*customer jquery script*@
    <script type="text/javascript">
        $(function () {
            $("#btnclick").click(function () {
                alert("hello");
            });
        });
    </script>

    If you want to put the JQuery reference in the _layout. cshtml, you could add it in the header.

    Besides, you could also try to use jquery-1.10.2.min.js file.

    Best regards,
    Dillion

    Friday, December 28, 2018 3:22 AM
  • User527076549 posted

     Thank you, will try that.

    Friday, December 28, 2018 5:33 PM