una - ¿Llamar a la función ASP.NET desde JavaScript?

llamar una funcion javascript desde javascript

Question

Estoy escribiendo una página web en ASP.NET. Tengo un código JavaScript y tengo un botón de envío con un evento de clic.

¿Es posible llamar a un método que creé en ASP con el evento de clic de JavaScript?

Answer 1

Estoy tratando de implementar esto, pero no está funcionando bien. La página vuelve a publicarse, pero mi código no se está ejecutando. Cuando depuro la página, el RaisePostBackEvent nunca se dispara. Una cosa que hice de manera diferente es que estoy haciendo esto en un control de usuario en lugar de en una página aspx.

Si alguien más es como Merk, y teniendo problemas para resolver esto, tengo una solución:

Cuando tiene un control de usuario, parece que también debe crear el PostBackEventHandler en la página principal. Y luego puede invocar el control de usuario PostBackEventHandler llamándolo directamente. Vea abajo:

public void RaisePostBackEvent(string _arg)
{
    UserControlID.RaisePostBackEvent(_arg);
}

Donde UserControlID es el ID que le dio el control del usuario en la página principal cuando lo anidó en la marca.

Nota: También puede simplemente llamar a los métodos que pertenecen a ese control de usuario directamente (en cuyo caso, solo necesitará el controlador RaisePostBackEvent en la página principal):

public void RaisePostBackEvent(string _arg)
{
    UserControlID.method1();
    UserControlID.method2();
}

Answer 2

La biblioteca de Microsoft AJAX logrará esto. También puede crear su propia solución que implique el uso de AJAX para llamar a sus propios archivos de script aspx (como básicamente) para ejecutar las funciones .NET.

Esta es la biblioteca llamada AjaxPro que se escribió un MVP llamado Michael Schwarz . Esta biblioteca no fue escrita por Microsoft.

He usado AjaxPro ampliamente, y es una muy buena biblioteca, que recomendaría para devoluciones de llamada simples al servidor. Funciona bien con la versión de Microsoft de Ajax sin problemas. Sin embargo, observaría que, con la facilidad con que Microsoft ha hecho de Ajax, solo lo usaría si fuera realmente necesario. Se necesita una gran cantidad de JavaScript para hacer alguna funcionalidad realmente complicada que obtiene de Microsoft simplemente colocándola en un panel de actualización.

Answer 3

Agregue esta línea a la carga de la página si está obteniendo un error de objeto esperado.

ClientScript.GetPostBackEventReference(this, "");

Answer 4

Bueno, si no desea hacerlo utilizando Ajax o de cualquier otra manera y solo desea que ocurra una devolución de datos normal de ASP.NET, aquí se explica cómo hacerlo (sin usar ninguna otra biblioteca):

Aunque es un poco complicado ... :)

yo. En su archivo de código (asumiendo que está usando C # y .NET 2.0 o posterior) agregue la siguiente Interfaz a su clase de Página para que se vea como

public partial class Default : System.Web.UI.Page, IPostBackEventHandler{}

ii. Esto debería agregar (usando Tab - Tab ) esta función a su archivo de código:

public void RaisePostBackEvent(string eventArgument) { }

iii. En su evento onclick en JavaScript, escriba el siguiente código:

var pageId = ''<%=  Page.ClientID %>'';
__doPostBack(pageId, argumentString);

Esto llamará al método ''RaisePostBackEvent'' en tu archivo de código con el ''eventArgument'' como el ''argumentoString'' que pasaste desde el JavaScript. Ahora puedes llamar a cualquier otro evento que te guste.

PD: Eso es ''subrayar-subrayar-hacerPostBack'' ... Y, no debería haber espacio en esa secuencia ... De alguna manera, el WMD no me permite escribir en los guiones bajos seguidos de un personaje.

Answer 5

Creo que la publicación del blog Cómo obtener y mostrar datos de la base de datos de SQL Server en la página ASP.NET utilizando Ajax (jQuery) te ayudará.

Código de JavaScript

<script src="http://code.jquery.com/jquery-3.3.1.js" />
<script language="javascript" type="text/javascript">

    function GetCompanies() {
        $("#UpdatePanel").html("<div style=''text-align:center; background-color:yellow; border:1px solid red; padding:3px; width:200px''>Please Wait...</div>");
        $.ajax({
            type: "POST",
            url: "Default.aspx/GetCompanies",
            data: "{}",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: OnSuccess,
            error: OnError
        });
    }

    function OnSuccess(data) {
        var TableContent = "<table border=''0''>" +
                                "<tr>" +
                                    "<td>Rank</td>" +
                                    "<td>Company Name</td>" +
                                    "<td>Revenue</td>" +
                                    "<td>Industry</td>" +
                                "</tr>";
        for (var i = 0; i < data.d.length; i++) {
            TableContent += "<tr>" +
                                    "<td>"+ data.d[i].Rank +"</td>" +
                                    "<td>"+data.d[i].CompanyName+"</td>" +
                                    "<td>"+data.d[i].Revenue+"</td>" +
                                    "<td>"+data.d[i].Industry+"</td>" +
                                "</tr>";
        }
        TableContent += "</table>";

        $("#UpdatePanel").html(TableContent);
    }

    function OnError(data) {

    }
</script>

Función del lado del servidor ASP.NET

[WebMethod]
[ScriptMethod(ResponseFormat= ResponseFormat.Json)]
public static List<TopCompany> GetCompanies()
{
    System.Threading.Thread.Sleep(5000);
    List<TopCompany> allCompany = new List<TopCompany>();
    using (MyDatabaseEntities dc = new MyDatabaseEntities())
    {
        allCompany = dc.TopCompanies.ToList();
    }
    return allCompany;
}

Answer 6

El método __doPostBack() funciona bien.

Otra solución (muy intrincada) es simplemente agregar un botón invisible de ASP en su marca y hacer clic en él con un método de JavaScript.

<div style="display: none;">
   <asp:Button runat="server" ... OnClick="ButtonClickHandlerMethod" />
</div>

Desde su JavaScript, recupere la referencia al botón usando su ClientID y luego llame al método .click () .

var button = document.getElementById(/* button client id */);

button.click();

Answer 7

Es posible que desee crear un servicio web para sus métodos comunes.
Simplemente agregue un atributo WebMethodAttribute sobre las funciones a las que desea llamar, y eso es todo.
Tener un servicio web con todas sus cosas comunes también hace que el sistema sea más fácil de mantener.

Answer 8

Es tan fácil para ambos escenarios (es decir, síncrono / asíncrono) si desea activar un controlador de eventos del lado del servidor, por ejemplo, el evento de clic del botón.

Para activar un controlador de eventos de un control: si ya agregó un ScriptManager en su página, omita el paso 1.

1. Agregue lo siguiente en su página página de script de cliente

   //<![CDATA[
   var theForm = document.forms[''form1''];
   if (!theForm) {
       theForm = document.form1;
   }
   function __doPostBack(eventTarget, eventArgument) {
       if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
           theForm.__EVENTTARGET.value = eventTarget;
           theForm.__EVENTARGUMENT.value = eventArgument;
           theForm.submit();
       }
   }
   //]]>

   2. Escriba su controlador de eventos del lado del servidor para su control

      btnSayHello_Click vacío vacío (objeto remitente, EventArgs e) {Label1.Text = "Hello World ..."; }

   3. Agregar una función de cliente para llamar al controlador de eventos del lado del servidor

      function SayHello () {__doPostBack ("btnSayHello", ""); }

Reemplace "btnSayHello" en el código anterior con el ID de cliente de su control.

Al hacerlo, si su control está dentro de un panel de actualización, la página no se actualizará. Eso es muy fácil.

Otra cosa que decir es que: tenga cuidado con la identificación del cliente, ya que depende de su política de generación de ID definida con la propiedad ClientIDMode.

Answer 9

Esta respuesta funciona como una brisa para mí gracias al navegador cruzado:

El método __doPostBack () funciona bien.

Otra solución (muy intrincada) es simplemente agregar un botón invisible de ASP en su marca y hacer clic en él con un método de JavaScript.

<div style="display: none;"> 
    <asp:Button runat="server" ... OnClick="ButtonClickHandlerMethod" /> 
</div> 

Desde su JavaScript, recupere la referencia al botón usando su ClientID y luego llame al método .Click ():

var button = document.getElementByID(/* button client id */); 

button.Click(); 

Blockquote

Answer 10

Intento esto y así podría ejecutar un método Asp.Net mientras uso jQuery.

1. Haz un redireccionamiento de página en tu código jQuery.

   window.location = "Page.aspx?key=1";

2. A continuación, utilice una cadena de consulta en la carga de la página

   protected void Page_Load(object sender, EventArgs e)
   {
       if (Request.QueryString["key"] != null)
       {
           string key= Request.QueryString["key"];
           if (key=="1")
           {
               // Some code
           }
       }
   }

Así que no hay necesidad de ejecutar un código extra

Answer 11

La biblioteca de Microsoft AJAX logrará esto. También puede crear su propia solución que implique el uso de AJAX para llamar a sus propios archivos de script aspx (como básicamente) para ejecutar las funciones .NET.

Sugiero la biblioteca de Microsoft AJAX. Una vez instalado y referenciado, solo agrega una línea en su página de carga o inicie:

Ajax.Utility.RegisterTypeForAjax(GetType(YOURPAGECLASSNAME))

Entonces puedes hacer cosas como:

<Ajax.AjaxMethod()> _
Public Function Get5() AS Integer
    Return 5
End Function

Luego, puedes llamarlo a tu página como:

PageClassName.Get5(javascriptCallbackFunction);

El último parámetro de su llamada de función debe ser la función de devolución de llamada javascript que se ejecutará cuando se devuelva la solicitud AJAX.

Answer 12

La forma más sencilla y mejor de lograr esto es usar el onmouseup() JavaScript en lugar de onclick()

De esa forma, activará JavaScript después de hacer clic y no interferirá con el evento ASP OnClick() .

Answer 13

La programación estática y fuertemente tipificada siempre me ha parecido muy natural, por lo que al principio me resistí a aprender JavaScript (sin mencionar HTML y CSS) cuando tuve que construir front-ends basados ​​en web para mis aplicaciones. Haría cualquier cosa para solucionar esto, como redirigir a una página solo para actuar y actuar en el evento OnLoad, siempre que pueda codificar C # puro.

Sin embargo, encontrará que si va a trabajar con sitios web, debe tener una mente abierta y comenzar a pensar más orientado a la web (es decir, no intente hacer cosas del lado del cliente en el servidor y viceversa) . Me encantan los formularios web de ASP.NET y todavía lo uso (así como MVC ), pero diré que al intentar simplificar las cosas y ocultar la separación del cliente y el servidor, puede confundir a los recién llegados y, de hecho, terminar haciendo las cosas más difíciles a veces. .

Mi consejo es aprender algo de JavaScript básico (cómo registrar eventos, recuperar objetos DOM, manipular CSS, etc.) y encontrará que la programación web es mucho más agradable (sin mencionar que es más fácil). Mucha gente mencionó diferentes bibliotecas de Ajax, pero no vi ningún ejemplo real de Ajax, así que aquí va. (Si no está familiarizado con Ajax, todo lo que está haciendo es hacer una solicitud HTTP asíncrona para actualizar el contenido (o quizás realizar una acción del lado del servidor en su escenario) sin volver a cargar la página completa o hacer una devolución de datos completa.

Lado del cliente:

<script type="text/javascript">
var xmlhttp = new XMLHttpRequest(); // Create object that will make the request
xmlhttp.open("GET", "http://example.org/api/service", "true"); // configure object (method, URL, async)
xmlhttp.send(); // Send request

xmlhttp.onstatereadychange = function() { // Register a function to run when the state changes, if the request has finished and the stats code is 200 (OK). Write result to <p>
    if (xmlhttp.readyState == 4 && xmlhttp.statsCode == 200) {
          document.getElementById("resultText").innerHTML = xmlhttp.responseText;
    }
};
</script>

Eso es. Aunque el nombre puede ser engañoso, el resultado puede estar en texto plano o JSON también, no está limitado a XML. jQuery proporciona una interfaz aún más sencilla para realizar llamadas Ajax (entre otras tareas de simplificación de JavaScript).

La solicitud puede ser un HTTP-POST o HTTP-GET y no tiene que estar en una página web, pero puede publicar en cualquier servicio que escuche solicitudes HTTP, como una API RESTful . La API web de ASP.NET MVC 4 hace que la configuración del servicio web del lado del servidor para manejar la solicitud sea también muy sencilla. Pero muchas personas no saben que también puede agregar controladores de API al proyecto de formularios web y usarlos para manejar llamadas Ajax como esta.

Lado del servidor:

public class DataController : ApiController
{
    public HttpResponseMessage<string[]> Get()
    {
        HttpResponseMessage<string[]> response = new HttpResponseMessage<string[]>(
            Repository.Get(true),
            new MediaTypeHeaderValue("application/json")
        );

        return response;
    }
}

Global.asax

Luego simplemente registre la ruta HTTP en su archivo Global.asax, para que ASP.NET sepa cómo dirigir la solicitud.

void Application_Start(object sender, EventArgs e)
{
    RouteTable.Routes.MapHttpRoute("Service", "api/{controller}/{id}");
}

Con AJAX y los Controladores, puede publicar en el servidor en cualquier momento de forma asíncrona para realizar cualquier operación del lado del servidor. Este doble golpe proporciona la flexibilidad de JavaScript y la potencia de C # / ASP.NET, lo que brinda a las personas que visitan su sitio una mejor experiencia general. Sin sacrificar nada, obtienes lo mejor de ambos mundos.

Referencias

• Ajax ,
• jQuery Ajax ,
• Controlador en formas web

Answer 14

Por favor intente esto:

<%= Page.ClientScript.GetPostBackEventReference(ddlVoucherType, String.Empty) %>;

ddlVoucherType es un control al que llamará el cambio de índice seleccionado ... Y puede poner cualquier función en el cambio de índice seleccionado de este control.

Answer 15

Prueba esto:

if(!ClientScript.IsStartupScriptRegistered("window"))
{
    Page.ClientScript.RegisterStartupScript(this.GetType(), "window", "pop();", true);
}

O esto

Response.Write("<script>alert(''Hello World'');</script>");

Use la propiedad OnClientClick del botón para llamar a funciones de JavaScript ...

Answer 16

Puede hacerlo de forma asincrónica utilizando .NET Ajax PageMethods. Ver here o here .

Answer 17

Puede usar PageMethods.Your C# method Name para acceder a los métodos C # o VB.NET en JavaScript.

Answer 18

Respecto a:

var button = document.getElementById(/* Button client id */);

button.click();

Debería ser como

var button = document.getElementById(''<%=formID.ClientID%>'');

Donde formID es el ID de control de ASP.NET en el archivo .aspx.

Answer 19

Si la función __doPostBack no se genera en la página, debe insertar un control para forzarlo así:

<asp:Button ID="btnJavascript" runat="server" UseSubmitBehavior="false" />

Answer 20

También puede obtenerlo simplemente agregando esta línea en su código JavaScript:

document.getElementById(''<%=btnName.ClientID%>'').click()

Creo que este es muy fácil!