ASP.NET - chemin à utiliser pour référencer .CSS et .JS

Question

J'ai une page maître à la racine de mon projet. J'ai des pages de contenu dans mon projet et dans les sous-dossiers faisant référence à cette page principale. Quelle est la bonne façon de référencer mes fichiers .CSS et .JS si je veux toujours qu'ils soient relatifs à la racine?

Voici comment je le fais maintenant:

 
link href="/common/css/global.css" 
script src="/common/javascript/global.js" 

Mais qui brise le lien. J'ai essayé sans le "/" principal mais cela n'a pas fonctionné sur mes pages dans les sous-dossiers.

Answer 1

J'utiliser quelque chose comme

Server.ResolveClientUrl("~/common/css/global.css") 

Cela obtenir une URL correcte pour vous en tout temps.

Exemple:

par le commentaire ce serait pleine utilisation.

<link type="text/css" rel="stylesheet" 
    href='<%= Server.ResolveClientUrl("~/common/css/global.css") %>' /> 

Selon les commentaires, d'autres usages validés, non « erreur CS1061: « System.Web.HttpServerUtility » ne contient pas de définition de » erreur:

<script type="text/javascript" 
src="<%= Page.ResolveUrl("~/Scripts/YourScript.js") %>" ></script> 

est également important de mettre toujours la fermeture tag.

Answer 2

Vous pouvez faire la balise <link> pour exécuter au serveur afin Asp.Net résoudra l'URL pour vous comme ceci:

<link href="~/common/css/global.css" runat="server" /> 

(Notez le « ~ »)
Je ne sais pas si ce peut être appliqué à la balise <script> cependant, vous devriez essayer ...

EDIT: J'ai découvert récemment sur un projet que vous pouvez (et devez) utiliser un ScriptManager pour contenir vos scripts (vous ne pouvez en avoir qu'un par page) . Vous pouvez en mettre un dans votre MasterPage et référencer tous vos scripts. Dans votre page de contenu, vous ajoutez ensuite un ScriptManagerProxy qui «référence» les scripts sur la page maître et vous pouvez même ajouter d'autres scripts pour cette page de contenu uniquement.

Answer 3

je le fais aussi simple que cela: link href="<%=ResolveUrl("~/common/css/global.css")%>"

Answer 4

Les solutions que j'ai vu jusqu'à présent ne fonctionnait pas dans mon projet (surtout pas pour les liens Css). Les questions sont les suivantes:

• l'intérieur <link> il ne réglait pas l'expression <%=...%>
• il n'a pas trouvé la page.ResolveUrl dans tous les cas
• il y avait des problèmes avec "et" citations si vous embedd <%=...%>

J'aimerais proposer cette solution: Dans le code derrière (C# de classe de votre page maître), ajoutez le la après 3 méthodes:

public partial class SiteBasic : System.Web.UI.MasterPage 
{ 
    public string ResolveURL(string url) 
    { 
     var resolvedURL=this.Page.ResolveClientUrl(url); 
     return resolvedURL; 
    } 

    public string cssLink(string cssURL) 
    { 
     return string.Format("<link href='{0}' rel='stylesheet' type='text/css'/>", 
        ResolveURL(cssURL)); 
    } 

    public string jsLink(string jsURL) 
    { 
     return string.Format("<script src='{0}' type='text/javascript'></script>", 
        ResolveURL(jsURL)); 
    } 
} 

Pour stylsheet références, vous pouvez dire:

<%=cssLink("~/css/custom-theme/jquery-ui-1.8.20.custom.css")%> 

Pour JavaScript références, il ressemble à ceci:

<%=jsLink("~/Scripts/jquery-1.7.2.js")%> 

Et pour autres références, vous pouvez utiliser:

<a href='<%=ResolveURL("~/Default.htm")%>'>link</a> 
<img title='image' src='<%=ResolveURL("~/Images/logo.png")%>'/> 

Note: Je trouve qu'il est préférable d'utiliser des guillemets simples des guillemets extérieurs et doubles à l'intérieur de l'attribut href ou src comme indiqué dans l'exemple ci-dessus. Le faire vice versa causé des problèmes dans certains cas, comme je l'ai trouvé.

Cette solution est simple et a bien fonctionné dans mon cas, même si les pages référençant la page maître résident dans des sous-répertoires différents. Ce qu'il fait est de traduire le chemin ~ (qui doit être absolu depuis la racine de votre site Web) dans un chemin relatif (en utilisant autant de ../ dans le chemin que nécessaire) en fonction de la page que vous affichez actuellement.

---

pointe avancée:

Si vous utilisez appels AJAX pour appeler des méthodes de service Web, alors vous aurez la même question leur référencement si vous avez des pages ASPX à différents niveaux de répertoire . Je vous recommande de définir quelque chose comme (en supposant que vos services Web résident dans le répertoire ~/AJAX):

<script type="text/javascript"> 
    function getWebServicePath() { return '<%=ResolveURL("~/AJAX/")%>'; } 
</script> 

dans la section <head> ... </head> de votre page maître. Cela rendra le chemin d'accès du service Web disponible dans votre JavaScript. Vous pouvez l'utiliser comme

$.ajax({ 
    type: "POST", 
    url: getWebServicePath()+"myWebService.asmx/myMethod", 
    data: $.toJSON({ param: "" }), 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (msg) { 
      // ... code on success ... 
    }, 
    error: function (ex) { 
      // ... code on error ... 
    } 
});