Insertar JavaScript en ASP.NET

Las maneras de insertar JavaScript en ASP.NET son variados, que van desde la página maestra (.Master) hasta cada una de las páginas aspx.

Insertar JavaScript en ASP.NET

Incluir las referencias a los archivos JavaScript en ASP es un poco diferente a como se podría incluir en páginas HTML.

Agregar referencias JavaScript en .Master

El archivo .Master es el archivo principal de una página ASP, este proporciona características a todas las páginas que sean hijas del .Master.

Es por esto por lo que siempre se proporcionan referencias a archivos CSS y JavaScript, además de características propias de HTML (meta, títulos, etc.).

Para agregar referencias a JavaScript desde el archivo .Master es posible de la siguiente forma:

<body>
    <form runat="server">
        <asp:ScriptManager runat="server">
            <Scripts>
                <asp:ScriptReference Path="~/Scripts/jquery-2.1.4.min.js" />
            </Scripts>
        </asp:ScriptManager>
    </form>
</body>
  • Se coloca la etiqueta ScriptManager.
  • Dentro de la etiqueta anterior se coloca la etiqueta Script.
  • Entre las etiquetas Script se colocan todas las referencias a los archivos JavaScript, mediante la etiqueta ScriptReference.

Podría interesarte Bundler and Minifier  

Agregar referencias JavaScript en páginas aspx

Así cómo es posible agregar referencias a todas las páginas de un sitio ASP, también es posible agregar referencias a una única página aspx.

Para incluir las referencias debemos realizar lo siguiente:

<asp: Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
    <asp:ScriptManagerProxy runat="server">
        <Scripts>
            <asp:ScriptReference Path="~/Scripts/jquery-3.3.1.js" />
        </Scripts>
    </asp:ScriptManagerProxy>
</asp:Content>
  • Dentro de la etiqueta de Content abrimos la etiqueta ScriptManagerProxy.
  • Posteriormente abrimos la etiqueta Scripts.
  • Dentro de Scripts ubicamos todas las referencias a los archivos JavaScript con la etiqueta ScriptReference.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *