Javascript Girl
  1. Javascript Girl
  3. Enregistrement correct de JavaScript et CSS dans les modèles d'éditeur MVC 2
Intereting Posts
Utilisation de colorbox sur une autre couleur à l'aide de jquery / ajax Améliorations de l'attribution de lettres dans un tableau de tableaux Three.js / webGL / GLSL – utilisant des calculs aléatoires Difficulté à publier des actions à la chronologie Restaurer la mise au point sur l'applet Java lorsque le navigateur / onglet gagne le focus Html5 charge l'audio / les métadonnées, mais pas l'audio? Attente dans les tests QUnit Comment réparer JSLint "manquant nouvelle" erreur Est-ce que Firebase limitToLast () prend de plus en plus longtemps que le nombre d'enregistrements d'un enfant augmente? XMLHttpRequest appelle toujours l'auditeur d'événement "charge", même lorsque la réponse a un état d'erreur Affectez dynamiquement le modèle ng Impossible d'utiliser le gulp-rev-remplacer le travail avec gulp-useref Javascript est-il un langage de programmation fonctionnel? Comment trouver les dates de début et de fin du texte de sélection en Javascript? Quelle est la différence entre transformer et réduire en lodash

Enregistrement correct de JavaScript et CSS dans les modèles d'éditeur MVC 2

Comment puis-je enregistrer correctement les blocs javascript dans un modèle d'éditeur ASP.NET MVC 2 (RTM)?

Le scénario spécifique dans lequel je suis est que je souhaite utiliser Dynarch JSCal2 DateTimePicker pour mon sélecteur de date-date standard, mais cette question est en général à tout paquet de javascript réutilisable. J'ai mon modèle fonctionnant correctement maintenant, mais il comprend mon JS et CSS dans ma page principale et je préférerais seulement inclure ces choses si j'en ai vraiment besoin: 

<link rel="stylesheet" type="text/css" href="../../Content/JSCal2-1.7/jscal2.css" /> <link rel="stylesheet" type="text/css" href="../../Content/JSCal2-1.7/border-radius.css" /> <script type="text/javascript" src="../../Scripts/JSCal2-1.7/jscal2.js"></script> <script type="text/javascript" src="../../Scripts/JSCal2-1.7/lang/en.js"></script>

Donc, évidemment, je pourrais simplement mettre ces lignes dans mon modèle, mais si j'ai un écran qui a 5 DateTimePickers, ce contenu serait dupliqué 5 fois, ce qui ne serait pas idéal. Quoi qu'il en soit, je souhaite toujours que le modèle de My View déclenche que ce code soit placé dans <head> de ma page.

Bien qu'il soit complètement sans rapport avec ma question, j'ai pensé que je partagerais mon modèle ici (jusqu'à présent) au cas où cela serait utile: 

 <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<DateTime>" %> <%= Html.TextBoxFor(model => Model) %> <input type="button" id="<%= ViewData.TemplateInfo.GetFullHtmlFieldId("cal-trigger") %>" value="..." /> <script type="text/javascript"> var <%= ViewData.TemplateInfo.GetFullHtmlFieldId("cal") %> = Calendar.setup({ trigger : "<%= ViewData.TemplateInfo.GetFullHtmlFieldId(string.Empty) %>", inputField : "<%= ViewData.TemplateInfo.GetFullHtmlFieldId(string.Empty) %>", onSelect : function() { this.hide(); }, showTime : 12, selectionType : Calendar.SEL_SINGLE, dateFormat : '%o/%e/%Y %l:%M %P' }); </script>

J'ajoute habituellement un espace réservé au script dans ma page principale qui est annulée par les vues:

Maîtriser: 

 <%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title></title> <asp:ContentPlaceHolder ID="Styles" runat="server" /> </head> <body> <asp:ContentPlaceHolder ID="MainContent" runat="server" /> <script type="text/javascript" src="scriptAvailableToAllPages.js"></script> <asp:ContentPlaceHolder ID="Scripts" runat="server" /> </body> </html>

Vue: 

 <%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<Ns.MyModel>" %> <asp:Content ID="indexScripts" ContentPlaceHolderID="Scripts" runat="server"> <script type="text/javascript" src="specific.js"></script> </asp:Content> <asp:Content ID="MainContent" ContentPlaceHolderID="MainContent" runat="server"> <% using (Html.BeginForm()) { %> <%= Html.EditorFor(x => x.Date1) %> <%= Html.EditorFor(x => x.Date2) %> <%= Html.EditorFor(x => x.Date3) %> <input type="submit" value="OK" /> <% } %> </asp:Content>

Notez comment le modèle d'éditeur est inclus pour trois propriétés différentes du modèle, mais les scripts requis sont inclus une seule fois.

Je crée un script simple Gérer pour gérer cela, malheureusement je ne l'ai pas fait pour le contrôle CSS Asp.Net MVC Manager pour javascript et les fichiers Css . Malheureusement, il ne fonctionne pas proeprly pour CSS, pour javascript, je les ai simplement au fond de mon fichier principal, mais CSS doit être dans la balise tête, je n'ai pas encore trouvé de façon à le faire …

Mais en utilisant cela, j'ai pu avoir un script dans un HtmlHelper personnalisé, DatePicker que j'utilise avec un modèle DateTime.ascx.

Le gestionnaire d'actifs Web telerik vous permet d'accomplir ce que vous voulez et est open source.