come aggiungere script src all'interno di una vista quando si usa Layout

101

Voglio includere un riferimento javascript come:

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

Se ho una vista Razor, qual è il modo corretto per includerla senza doverla aggiungere al layout (ne ho bisogno solo in una vista specifica, non in tutte)

In aspx, potremmo usare i segnaposto dei contenuti .. Ho trovato esempi più vecchi che utilizzano aspx in mvc ma non nella vista Razor ..

asp.net-mvc razor

— dferraro
fonte

Basta aggiungere il tag dello script alla visualizzazione.

— jrummell

Voglio solo aggiungere lo script nella mia visualizzazione, ma quando visualizzo il codice sorgente sulla pagina che viene creata, inserisce i tag dello script all'interno del <body> dell'html invece che del <head>?

— dferraro

per i browser più recenti type = "text / javascript" non è necessario

— Mark Schultheiss

Risposte:

172

A seconda di come vuoi implementarlo (se ci fosse una posizione specifica in cui desideri gli script) potresti implementare un @sectionall'interno del tuo _Layoutche ti consentirebbe di aggiungere ulteriori script dalla vista stessa, pur mantenendo la struttura. per esempio

_Disposizione

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

Visualizza

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

Altrimenti, quello che hai va bene. Se non ti dispiace che sia "in linea" con la vista che è stata prodotta, puoi inserire la <script>dichiarazione all'interno della vista.

— Brad Christie
fonte

A proposito, le sezioni sono essenzialmente i tuoi segnaposto di contenuti a cui ti riferivi. Guarda il progetto web MVC predefinito e come inseriscono un'intestazione nella pagina.

— Brad Christie

Grazie. Questo era quello che stavo cercando, ma è possibile farlo senza RenderSection? Dici 'quello che hai va bene' - ma non ho ancora niente ... Ho provato a mettere i riferimenti allo script all'inizio di .cshtml, ma il risultato è che i riferimenti sono nel <body> ma dovrebbero essere in testa

— dferraro

@dferraro: quindi devi aggiungere RenderSection("Scripts")al tuo layout (come faresti con un segnaposto) e quindi definire un @section Scripts {}all'interno della vista. Ad un certo punto è imminente una modifica al "master" (_layout). Non puoi semplicemente definire qualcosa all'interno di una vista e dirgli "mettilo tra <head>per me" (a meno che tu non voglia entrare in una sceneggiatura che aggiunge una sceneggiatura)

— Brad Christie

+1. Anche @dferraro una cosa migliore sarebbe mettere i riferimenti a jQuery e RenderSection prima di </body> e non nella testa. Lettura vecchia ma pertinente: developer.yahoo.com/blogs/ydn/posts/2007/07/high_performanc_5

— MikeSmithDev

Se il tuo script non è nella Scriptscartella, potresti dover abilitare anche l'accesso ad esso: stackoverflow.com/questions/24763493/…

— Homer

Se stai utilizzando il motore di visualizzazione Razor, modifica il file _Layout.cshtml. Sposta il @ Scripts.Render ("~ / bundles / jquery") presente nel piè di pagina nella sezione dell'intestazione e scrivi il codice javascript / jquery come desideri:

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

— Dilip Nannaware
fonte

Puoi aggiungere i tag di script come usiamo in asp.net mentre esegui le convalide lato client come di seguito.

@{
    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
fonte

per i browser più recenti type="text/javascript"non è necessario

— Mark Schultheiss