SoftwareSavant
SoftwareSavant

Reputation: 9765

adding Jquery libraries to MVC4 applications

Can someone please explain to me how you add jquery libraries to an asp.net MVC4 application. I am trying to figure out how to add them to razor views. All I can find online are tutorials for Jquery Mobile? Well, I just want to know how to add jquery libraries to cshtml views. Any link with some example would be great.

Upvotes: 5

Views: 5126

Answers (2)

Adam Mendoza
Adam Mendoza

Reputation: 5903

What if instead of adding it to each view you add it via RegisterBundles in the Global.asax.cs?

   private void RegisterBundles(BundleCollection bundles)

    {
    var js = new Bundle("~/scripts/MercerAdvisors.OnTrack.Bundle.js", typeof(JsBundleOnly));

    js.AddFile("~/Scripts/jquery-1.7.2.js");
    js.AddFile("~/Scripts/jquery.validate.js");
    js.AddFile("~/Scripts/jquery.validate.unobtrusive.js");
    js.AddFile("~/Scripts/jquery.tipTip.minified.js");
    js.AddFile("~/Scripts/jquery-ui-1.8.16.js");
    js.AddFile("~/Scripts/jquery.layout.js");
    js.AddFile("~/Scripts/checkRadio.js");
    js.AddFile("~/Scripts/jquery.formatCurrency-1.4.0.js");
    js.AddFile("~/Scripts/rangeValidator.js");
    js.AddFile("~/Scripts/jquery.nimble.loader.js");
    js.AddFile("~/Scripts/jquery.maskedinput-1.3.js");
    js.AddFile("~/Scripts/jquery.sparkline.js");
    js.AddFile("~/Scripts/jquery.loadmask.js");
    js.AddFile("~/Scripts/DataTables-1.8.2/media/js/jquery.dataTables.js");
    js.AddFile("~/Scripts/FixedColumns.min.js");
    js.AddFile("~/Scripts/ZeroClipboard.js");
    js.AddFile("~/Scripts/jquery.livequery.js");
    js.AddFile("~/Scripts/jquery.timers-1.2.js");
    js.AddFile("~/Scripts/selectToUISlider.jQuery.js");

    bundles.Add(js);

    var jqueryCss = new Bundle("~/Content/themes/base/jQuery.Bundle.css", typeof(CssBundleOnly));

    jqueryCss.AddFile("~/Content/themes/base/jquery-ui.css");

    bundles.Add(jqueryCss);

}

Upvotes: 0

Thulasiram
Thulasiram

Reputation: 8552

Download the script file. add the script in script folder

<script src="@Url.Content("~/Scripts/jquery-1.7.2.min.js")" type="text/javascript"></script>
//Or
<script src="../../Scripts/jquery-1.7.2.min.js" type="text/javascript"></script> 

then call the above script line in layout page.

Upvotes: 3

Related Questions