Llamar a la función JavaScript desde CodeBehind

150

¿Alguien puede proporcionar buenos ejemplos de llamar a una función de JavaScript desde CodeBehind y viceversa?

ssmsnet
fuente
Aquí se detalla el artículo codepedia.info/... usando con y sin Panel de actualización de Ajax
Satinder singh

Respuestas:

206

Puedes probar esto:

Page.ClientScript.RegisterStartupScript(this.GetType(),"CallMyFunction","MyFunction()",true);
mutanico
fuente
41
Iría por el ScriptManager.RegisterStartupScript (Page, typeof (Page), "somekey", script, true); Acercarse. Funciona también durante las devoluciones parciales.
rdmptn
10
1. A veces Page.ClientScript.RegisterClientScriptBlockse requiere en su lugar ver esta publicación para obtener información . 2. Vale la pena mencionar que para que MyFunction () funcione, MyFunction () debe definirse antes de las etiquetas de formulario o dentro de ellas, pero NO después de la etiqueta de finalización </form> (de lo contrario, un error esperado del Objeto ocurrir)
BornToCode
2
ScriptManager.RegisterStartupScript(this.Page, typeof(Page), "text", "openDep()", true);trabajos. this.GetType()me arroja un error
SearchForKnowledge
2
Esto no funciona cuando el código envuelto con un asp:UpdatePanely escrito en un evento de botón. Lo que hace que la página se devuelva.
Senura Dissanayake
52

C # a JavaScript: puede registrar el bloque de script para ejecutar en la página de la siguiente manera:

ClientScript.RegisterStartupScript(GetType(),"hwa","alert('Hello World');",true);

reemplace la alert()parte con el nombre de su función.

Para llamar al método C # desde JavaScript, puede usar ScriptManagero jQuery. Yo personalmente uso jQuery. Debe decorar el método al que desea llamar desde JavaScript con el WebMethodatributo Para obtener más información sobre cómo llamar al método C # (llamado PageMethod) jQuery, puede consultar la publicación de Dave Ward .

TheVillageIdiot
fuente
51

Llamar a una función de JavaScript desde el código detrás

Paso 1 Agregue su código Javascript

<script type="text/javascript" language="javascript">
    function Func() {
        alert("hello!")
    }
</script>

Paso 2 Agregue 1 Script Manager en su webForm y agregue 1 botón también

Paso 3 Agregue este código en su evento de clic de botón

ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "text", "Func()", true);
Orlando Herrera
fuente
Al intentar hacer esto cuando se hace clic en una fila de GridView, solo funciona cuando se usa ScriptManagercomo en esta respuesta, no Page.ClientScriptcomo en otras respuestas. Podría estar relacionado con el asp:UpdatePanelcomentario debajo de la respuesta aceptada.
Chris
16

No puedes hacer esto directamente. En WebForms estándar, JavaScript es interpretado por el navegador y C # por el servidor. Lo que puede hacer para llamar a un método desde el servidor usando JavaScript es.

Me gusta esto:

Paso 1

public partial class Products : System.Web.UI.Page 
{ 
    [System.Web.Services.WebMethod()] 
    [System.Web.Script.Services.ScriptMethod()] 
    public static List<Product> GetProducts(int cateogryID) 
    {
        // Put your logic here to get the Product list 
    }

Paso 2: Agregar un ScriptManageren elPage

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />

Paso 3: llamar al método usando JavaScript

function GetProductsByCategoryID(categoryID)
{
    PageMethods.GetProducts(categoryID, OnGetProductsComplete);
}

Echa un vistazo a este enlace.

Para llamar a una función de JavaScript desde el servidor, puede usar RegisterStartupScript:

ClientScript.RegisterStartupScript(GetType(),"id","callMyJSFunction()",true);
Vismari
fuente
¿Dónde ubica el primer paso en la jerarquía de archivos MVC 3?
Rob
@Rob La GetProducts()función es solo una función de código subyacente que viviría en un controlador en una aplicación MVC, por lo que las etiquetas van por encima de cualquier función que desee poner en un controlador al que desea llamar desde JavaScript .
vapcguy
15

Si necesita enviar un valor como parámetro.

string jsFunc = "myFunc(" + MyBackValue + ")";
ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "myJsFn", jsFunc, true);
Liko
fuente
8

Otra cosa que podría hacer es crear una variable de sesión que se establezca en el código detrás y luego verificar el estado de esa variable y luego ejecutar su javascript. Lo bueno es que te permitirá ejecutar tu script justo donde quieras en lugar de tener que averiguar si quieres que se ejecute en el DOM o globalmente.

Algo como esto: Código detrás:

Session["newuser"] = "false" 

En javascript

var newuser = '<%=Session["newuser"]%>';
 if (newuser == "yes")
     startTutorial();  
Prakash Joshi
fuente
7

No puedes. Codebehind se ejecuta en el servidor mientras que JavaScript se ejecuta en el cliente.

Sin embargo, puede agregar <script type="text/javascript">someFunction();</script>a su salida y, por lo tanto, hacer que se llame a la función JS cuando el navegador está analizando su marcado.

ThiefMaster
fuente
65
"No puedes. Pero así es como lo haces".
3
No consideraría que llamar a un método desde el código del lado del servidor ya que no tiene una forma real de obtener un valor de retorno o especificar una devolución de llamada.
ThiefMaster
8
Aw, claro que puedes. Puede devolver una devolución de datos desde su javascript o AJAX. Pensé que era divertido; Tiendo a hacer lo mismo: "No, eso es imposible. Nadie querría hacer eso si pudiera". luego, unos minutos más tarde "Así que así es como vamos a hacerlo".
7

Puedes usar literal:

this.Controls.Add(new LiteralControl("<script type='text/javascript'>myFunction();</script>"));
Dilip Kumar Yadav
fuente
1
¿Pero esto no solo agrega un script a la memoria, en realidad no lo ejecuta también?
Fandango68
5

IIRC Code Behind se compila en el lado del servidor y javascript se interpreta en el lado del cliente. Esto significa que no hay un enlace directo entre los dos.

Lo que puede hacer, por otro lado, es que el cliente y el servidor se comuniquen a través de una ingeniosa herramienta llamada AJAX. http://en.wikipedia.org/wiki/Asynchronous_JavaScript_and_XML

Berry Ligtermoet
fuente
5

Prueba esto en Code Behind y funcionará al 100%

Escriba esta línea de código en su archivo Code Behind

string script = "window.onload = function() { YourJavaScriptFunctionName(); };";
ClientScript.RegisterStartupScript(this.GetType(), "YourJavaScriptFunctionName", script, true);

Y esta es la página del formulario web

<script type="text/javascript">
    function YourJavaScriptFunctionName() {
        alert("Test!")
    }
</script>
Chandan Kumar
fuente
4
ScriptManager.RegisterStartupScript(this, this.Page.GetType(),"updatePanel1Script", "javascript:ConfirmExecute()",true/>
Apps Tawale
fuente
8
Agregue alguna explicación
ketan el
4

Ejemplo de trabajo: _

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage2.Master" AutoEventWireup="true" CodeBehind="History.aspx.cs" Inherits="NAMESPACE_Web.History1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>


 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 

        <script type="text/javascript">

            function helloFromCodeBehind() {
                alert("hello!")
            }


        </script>

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">

 <div id="container"  ></div>

</asp:Content>

Código detrás

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace NAMESPACE_Web
{
    public partial class History1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

            ScriptManager.RegisterStartupScript(this, GetType(), "displayalertmessage", "helloFromCodeBehind()", true);
        }

    }
}

Posibles escollos: -

  1. Es posible que el código y el HTML no estén en el mismo espacio de nombres
  2. CodeBehind="History.aspx.cs" está apuntando a una página incorrecta
  3. La función JS está teniendo algún error
Hitesh Sahu
fuente
3

Me he dado cuenta de que muchas de las respuestas aquí están usando ScriptManager.RegisterStartupScripty si vas a hacer eso, esa no es la forma correcta de hacerlo. La forma correcta es usar ScriptManager.RegisterScriptBlock([my list of args here]). La razón es que solo debe usar RegisterStartupScript cuando se carga su página (de ahí el nombre RegisterStartupScript).

En VB.NET:

ScriptManager.RegisterClientScriptBlock(Page, GetType(String), "myScriptName" + key, $"myFunctionName({someJavascriptObject})", True)

C ª#:

ScriptManager.RegisterClientScriptBlock(Page, typeof(string), "myScriptName" + key, $"myFunctionName({someJavascriptObject})", true);

Por supuesto, espero que sea obvio que necesita reemplazar la clave con su identificador de clave y probablemente debería mover todo esto a una sub / función / método y pasar la clave y someJavascriptObject (si su método javascript requiere que su argumento sea un objeto javascript).

Documentos de MSDN:

https://msdn.microsoft.com/en-us/library/bb338357(v=vs.110).aspx

cr1pto
fuente
3
ScriptManager.RegisterStartupScript(Page, GetType(), "JavaFunction", "AlertError();", true);

usar su función es suficiente

rey sádico
fuente
2
¿Puedes explicar tu respuesta un poco más?
maxpaj
1
¿Qué es este parámetro "JavaFunction"? ¿Podemos agregar algo en él? ¿Qué necesita tener en ese argumento?
Senura Dissanayake
1
@SenuraDissanayake Es un título, sí, puede ser cualquier cosa y realmente no importa.
vapcguy
2

Así es como lo hice.

El marcado HTML que muestra un control de etiqueta y botón es el siguiente.

<body> 
  <form id="form1" runat="server"> 
  <div> 
    <asp:Label ID="lblJavaScript" runat="server" Text=""></asp:Label> 
    <asp:Button ID="btnShowDialogue" runat="server" Text="Show Dialogue" /> 
  </div> 
  </form> 
</body>

La función de JavaScript está aquí.

<head runat="server"> 
  <title>Calling javascript function from code behind example</title> 
  <script type="text/javascript"> 
    function showDialogue() { 
      alert("this dialogue has been invoked through codebehind."); 
    } 
  </script> 
</head>

El código detrás para activar la función de JavaScript está aquí.

lblJavaScript.Text = "<script type='text/javascript'>showDialogue();</script>";
evaggy
fuente
1

esto funciona para mi

object Json_Object=maintainerService.Convert_To_JSON(Jobitem);
ScriptManager.RegisterClientScriptBlock(this,GetType(), "Javascript", "SelectedJobsMaintainer("+Json_Object+"); ",true);
Kirk Patrick Brown
fuente
1

Como no pude encontrar una solución que tuviera un código detrás, que incluye probar el ClientScriptyScriptManager como dijo mutanic y Orlando Herrera en esta pregunta (ambos de alguna manera no), voy a ofrecer una solución front-end que utiliza clics de botón a otros si Están en la misma posición que yo. Esto funcionó para mí:

Marcado HTML:

<asp:button ID="myButton" runat="server" Text="Submit" OnClientClick="return myFunction();"></asp:button>

JavaScript:

function myFunction() {
    // Your JavaScript code
    return false;
}

Simplemente estoy usando un botón ASP.NET que utiliza la OnClientClickpropiedad, que activa las funciones de secuencias de comandos del lado del cliente, que es JavaScript. Las cosas clave a tener en cuenta aquí son los usos de la returnpalabra clave en la llamada a la función y en la función misma. He leído documentos que no se usan returnpero que aún funcionan con el clic del botón, de alguna manera no funcionó para mí. La return false;declaración en la función especifica que una devolución no debe suceder. También podría usar esa declaración en la OnClientClickpropiedad:OnClientClick="myFunction() return false;"

Max Voisard
fuente
0

Usé ScriptManager en Code Behind y funcionó bien.

ScriptManager.RegisterStartupScript(UpdatePanel1, UpdatePanel1.GetType(), "CallMyFunction", "confirm()", true);

Si está utilizando UpdatePanel en ASP Frontend. Luego, ingrese el nombre del UpdatePanel y el 'nombre de la función' definidos con etiquetas de script.

Ravi Agrawal
fuente
0

Gracias "Liko", solo agrega un comentario a su respuesta.

string jsFunc = "myFunc(" + MyBackValue + ")";
ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "myJsFn", jsFunc, true);

Se agregaron comillas simples ( ') a la variable; de ​​lo contrario, se mostrará un mensaje de error:

string jsFunc = "myFunc('" + MyBackValue + "')";
Stephen
fuente
-1

No puede llamar a una función Javascript desde CodeBehind, porque el archivo CodeBehind contiene el código que ejecuta el lado del servidor en el servidor web. El código Javascript se ejecuta en el navegador web en el lado del cliente.

Charlie Kilian
fuente
1
No puede llamar a una función de JavaScript directamente como en myCoolJavascriptFunction (javascriptFunctionArgs); en el servidor, pero puede llamar a una función de JavaScript desde el código que se encuentra en una página de WebForms.
cr1pto
de acuerdo con cloudstrifebro
Khurram Ishaque
-1

Puede exponer los métodos de C # en las páginas de código subyacente para que se puedan llamar a través de JavaScript utilizando el atributo ScriptMethod .

No puede llamar a JavaScript desde CodeBehind: ese código existe únicamente en el cliente.

Josh Kodroff
fuente