CODEWITHSUNDEEP
jqueryhtmlcssasp.net-mvc
Mishaa
Mishaa

Reputation: 97

Scripts added to _Layout don't work in view page

I add all my style and scripts to _Layout, there is no problem with the style of my views but the problem is the scripts don't work in views. for example, I add jquery to _Layout, but in view, if I call any function of jquery it says "$ is not defined". which means jquery doesn't add to my view. and I should add jquery to my view too. I tried to use Bundle but in this situation even my style not working. none of them work for me.

public class BundleConfig
{


    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundels/base/Jquery").Include(
            "~/MyContent/Bootstrap4/bootstrap4/jquery-3.2.1.min.js"

        ));
        bundles.Add(new ScriptBundle("~/bundels/base/BootstrapJs").Include(
           "~/MyContent/Bootstrap4/bootstrap4/popper.min.js",
           "~/MyContent/Bootstrap4/bootstrap4/bootstrap-4.0.0.js"
       ));

        bundles.Add(new ScriptBundle("~/bundels/base/MyJs").Include(
            "~/MyContent/Bootstrap4/SidebarMenu/sideBarMenuJs.js",
            "~/MyContent/Bootstrap4/menuBar/menuBarJs.js",
            "~/MyContent/Bootstrap4/customerSlider/customerJs.js",
            "~/MyContent/Bootstrap4/VideoIntro/videoJs.js",
            "~/MyContent/Bootstrap4/table/tableJs.js",
            "~/MyContent/Bootstrap4/commentSlider/CommentSlider.js",
            "~/MyContent/Bootstrap4/Header/headerJs.js",
            "~/MyContent/Bootstrap4/General/generalJs.js"
        ));
        bundles.Add(new StyleBundle("~/bundels/base/bootstrapcss").Include(
          "~/MyContent/Bootstrap4/bootstrap4/bootstrap-4.0.0.css",
          "~/MyContent/Bootstrap4/IcoFont/icofont.css"
       ));
        bundles.Add(new StyleBundle("~/bundels/base/MyCss").Include(
           "~/MyContent/Bootstrap4/SidebarMenu/sidebarmenuStyle.css",
           "~/MyContent/Bootstrap4/table/TableStyle.css",
           "~/MyContent/Bootstrap4/menuBar/menuBarStyle.css",
           "~/MyContent/Bootstrap4/General/style.css",
           "~/MyContent/Bootstrap4/customerTab/customerTabSlider.css",
           "~/MyContent/Bootstrap4/customerSlider/customerSlider.css",
           "~/MyContent/Bootstrap4/Header/headerStyle.css",
           "~/MyContent/Bootstrap4/VideoIntro/VideoIntroStyle.css",
           "~/MyContent/Bootstrap4/footer/FooterStyle.css"
        ));

        BundleTable.EnableOptimizations = true;
    }
}
public class MvcApplication : System.Web.HttpApplication
{
    protected void Application_Start()
    {
        AreaRegistration.RegisterAllAreas();
        RouteConfig.RegisterRoutes(RouteTable.Routes);
        BundleConfig.RegisterBundles(BundleTable.Bundles);
    }


}

and I call them 

@Styles.Render("~/bundels/base/bootstrapcss");
@Styles.Render("~/bundels/base/MyCss");
 @Scripts.Render("~/bundels/base/Jquery");
 @Scripts.Render("~/bundels/base/BootstrapJs");
 @Scripts.Render("~/bundels/base/MyJs");

this is an example of my _Layout:

  <!DOCTYPE html>
<html>
<head>



 <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body class="persianumber" style="direction: @($"{(lang?.ToLower() == "fa" ? "rtl" : "ltr")}")">

<header class="border-bottom">

</header>
<nav class="container-fluid bg-white sticky-top d-block d-lg-none ">

</nav>



@RenderBody()



<section class="container-fluid pb-5  bg-black">

</section>
<section class="container-fluid pb-5  footer-top">

</section>
<footer class="container-fluid bg-dark">

</footer>
<script src="~/MyContent/js/jquery-3.2.1.min.js?v=" @Sessions.UpdateVersion></script>

<script src="~/MyContent/js/popper.min.js?v=" @Sessions.UpdateVersion></script>

<script src="~/MyContent/js/bootstrap-4.0.0.js?v=" @Sessions.UpdateVersion></script>

<script src="~/MyContent/SidebarMenu/sideBarMenuJs.js?v=" @Sessions.UpdateVersion></script>

</body>
</html>

Did I miss something?

Upvotes: 1

Views: 178

Answers (1)

Basil Abubaker
Basil Abubaker

Reputation: 1651

Remove the optimizations from the bundle

BundleTable.EnableOptimizations = true;

then if it works try to call the jquery along without the Optimizations

Upvotes: 1

Related Questions