cómo agregar script src dentro de una vista cuando se usa Layout

99

Quiero incluir una referencia de javascript como:

<script src="@Url.Content("~/Scripts/jqueryFoo.js")" type="text/javascript"></script>

Si tengo una vista de Razor, ¿cuál es la forma correcta de incluir esto sin tener que agregarlo al diseño (solo lo necesito en una sola vista específica, no en todas)?

En aspx, podríamos usar marcadores de posición de contenido ... Encontré ejemplos más antiguos usando aspx en mvc pero no en la vista Razor ...

asp.net-mvc razor dferraro
fuente
1
Simplemente agregue la etiqueta de secuencia de comandos a su vista.
jrummell
1
Solo quiero agregar el script en mi vista, pero cuando veo el código fuente en la página que se crea, ¿coloca las etiquetas del script dentro del <body> del html en lugar del <head>?
dferraro
para navegadores más recientes type = "text / javascript" no es necesario
Mark Schultheiss

Respuestas:

169

Dependiendo de cómo desee implementarlo (si había una ubicación específica en la que deseaba los scripts), podría implementar un @sectiondentro de su _Layoutque le permitiría agregar scripts adicionales desde la vista en sí, sin dejar de conservar la estructura. p.ej

_Diseño

<!DOCTYPE html>
<html>
  <head>
    <title>...</title>
    <script src="@Url.Content("~/Scripts/jquery.min.js")"></script>
    @RenderSection("Scripts",false/*required*/)
  </head>
  <body>
    @RenderBody()
  </body>
</html>

Ver

@model MyNamespace.ViewModels.WhateverViewModel
@section Scripts
{
  <script src="@Url.Content("~/Scripts/jqueryFoo.js")"></script>
}

De lo contrario, lo que tienes está bien. Si no le importa que esté "en línea" con la vista que se generó, puede colocar la <script>declaración dentro de la vista.

Brad Christie
fuente
3
Por cierto, las secciones son esencialmente los marcadores de contenido a los que se refería. Vea el proyecto web MVC predeterminado y cómo colocan un encabezado en la página.
Brad Christie
Gracias. Esto era lo que estaba buscando, pero ¿es posible hacer esto sin RenderSection? Dices 'lo que tienes está bien', pero todavía no tengo nada ... Intenté poner las referencias del script en la parte superior del .cshtml, pero el resultado es que las referencias están en el <body> pero deberían estar en la cabeza
dferraro
3
@dferraro: luego debe agregar RenderSection("Scripts")a su diseño (como lo haría con un marcador de posición) y luego definir un @section Scripts {}dentro de la vista. En algún momento, una modificación del "maestro" (_layout) es inminente. No puedes simplemente definir algo dentro de una vista y decirle "colócalo entre <head>para mí" (a menos que quieras ingresar a un guión que agregue un guión)
Brad Christie
2
+1. También @dferraro sería mejor poner las referencias a jQuery y RenderSection antes de </body> y no en la cabeza en absoluto. Lectura antigua pero relevante: developer.yahoo.com/blogs/ydn/posts/2007/07/high_performanc_5
MikeSmithDev
1
Si su secuencia de comandos no está en la Scriptscarpeta, es posible que también deba habilitar el acceso a ella: stackoverflow.com/questions/24763493/…
Homer
12

Si está utilizando el motor de visualización de Razor, edite el archivo _Layout.cshtml. Mueva el @ Scripts.Render ("~ / bundles / jquery") presente en el pie de página a la sección del encabezado y escriba el código javascript / jquery como desee:

@Scripts.Render("~/bundles/jquery")
<script type="text/javascript">
    $(document).ready(function () {
        var divLength = $('div').length;
        alert(divLength);
    });
</script>
Dilip Nannaware
fuente
0

Puede agregar las etiquetas de script como las usamos en asp.net mientras hacemos validaciones del lado del cliente como a continuación.

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<script type="text/javascript" src="~/Scripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
    $(function () {
       //Your code
    });
</script>
Santhosh kumar Vadlamani
fuente
para navegadores más recientes type="text/javascript"no es necesario
Mark Schultheiss