2011-09-16 26 views
9

Soy nuevo en MVC3 Razor y quiero mostrar el tiempo de ejecución en una vista (index.cshtml). utilizo una función de JavaScript y lo puse en _Layout.cshtml lo que todos los otros puntos de vista "casa" pueden usarlo (ver siguiente fragmento)MVC3 Razor: llame a la función javascript desde view

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title> 
     @ViewBag.Title 
    </title> 
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> 
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script> 
</head> 
<script type="text/javascript"> 
    var uhr = new Date(); 
    var minuten; 
    var stunden; 
    var sekunden; 
    var interval = 500; 

    function datum(id) { 
     uhr.setTime(uhr.getTime() + interval); 
     window.setTimeout(function() { datum(id) }, interval); 
     minuten = uhr.getMinutes(); 
     stunden = uhr.getHours(); 
     sekunden = uhr.getSeconds(); 
     if (minuten < 10) { minuten = '0' + minuten; } 
     if (sekunden < 10) { sekunden = '0' + sekunden; } 
     if (stunden < 10) { stunden = '0' + stunden; } 
     document.getElementById(id).innerHTML = 'Jetzt ist: ' + stunden + ':' + minuten + ':' + sekunden; 
    } 
</script> 

Mis preguntas: 1. ¿Cómo puedo llamar a esta función (por ejemplo dato ("uhr")) de index.cshtml? Mi intento (ver a continuación) no funciona:

@section SideBar { 
    <p> 
     <ul> 
      <li><a href="Index.cshtml">Add Job</a></li> 
      <li><a href="About.cshtml">About</a></li> 
     </ul> 
    </p> 
    <p> 
     The time is: datum("uhr"); 
    </p> 
} 
  1. Cualquier otra manera "mejor"?
  2. ¿Es una buena práctica? No estoy seguro de si es correcto poner la función javascript en _Layout.cshtml.

Thx por adelantado.

Respuesta

11

Debe moverse el código desde _Layout.cshtml en un archivo .js separado y añádale una referencia.

Además, debe cambiar el código index.cshtml ser la siguiente:

@section SideBar { 
<p> 
    <ul> 
     <li><a href="Index.cshtml">Add Job</a></li> 
     <li><a href="About.cshtml">About</a></li> 
    </ul> 
</p> 
<p> 
    The time is: <span id="uhr"></span> 
</p> 
<script type="text/javascript">datum("uhr");</script> 
} 

JS Fiddle Example

+0

en qué carpeta debo poner el archivo .js? – MagB

+0

Las secuencias de comandos con sus otros archivos de JavaScript tendrían más sentido. –

+0

Pongo el nuevo .js en la carpeta de scripts y funciona. Pero el segundo corre más rápido que el segundo real. Cómo controlar esto? Thx por adelantado. – MagB

-3

La última línea de la función de referencia debe regresar el tiempo en lugar de establecer el innerHTML:

return 'Jetzt ist: ' + stunden + ':' + minuten + ':' + sekunden; 

y su HTML, entonces puede ser algo como esto:

The time is: <script type="text/javascript">datum(uhr)</script> 
+0

desafortunadamente no funciona. Thx por tu intento. – MagB

Cuestiones relacionadas