Pourquoi JQuery UI ne fonctionne pas avec ASP.NET MVC ?
Ne pas oublier d'installer le NuGet JQuery UI :
@Scripts.Render( "~/bundles/jquery" )
en bas de la page :
\\WebMvcApplication1\Views\Shared\_Layout.cshtml
Remponne avec l'instruction de la \\Views\Home\Page1.cshtml
@{
ViewBag.Title = "Page1";
}
<script src="~/Scripts/jquery-1.6.4.js"></script>
<script src="~/Scripts/jquery-ui-1.11.4.js"></script>
<link href="~/Content/themes/base/all.css" rel="stylesheet" />
<link href="~/Content/themes/base/accordion.css" rel="stylesheet" />
<script type="text/javascript">
$(function () {
$("#accordion").accordion();
});
</script>
<h2>Page1</h2>
<div id="accordion">
<h3>This is the Title1</h3>
<div>
<p>
Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
</p>
</div>
<h3>This is the Title2</h3>
<div>
<p>
Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
suscipit faucibus urna.
</p>
</div>
</div>
Solution pour utiliser JQuery UI dans les page ASP.NET MVC
Déplacer l'instruction :
@Scripts.Render( "~/bundles/jquery" )
de la page : \\WebMvcApplication1\Views\Shared\_Layout.cshtml
dans les balises <head> au début de la page. Comme ceci :
dans les balises <head> au début de la page. Comme ceci :
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - Mon application ASP.NET</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render( "~/bundles/jquery" )
</head>
Supprimer l'instruction :
<script src="~/Scripts/jquery-1.6.4.js"></script>
de la page \\Views\Home\Page1.cshtml
Et ça y est, ça fonctionne :
 |
| J'ai ajouté une page dans laquelle j'utilise l'accordion JQuery UI |
 |
| L'accordion JQuery UI s'affiche dans ma page ASP.NET MVC |
Incroyable non ? N'est ce pas de la magie !
Have Fun !
Have Fun !
Aucun commentaire:
Enregistrer un commentaire
Pour plus d'interactivité, n'hésitez pas à laisser votre commentaire.