Lancer l'événement Ontextchanged d'un Asp: TextBox via Javascript

Shiv Yadav 11 décembre 2023

JavaScript JavaScript Ajax

Lancer l'événement Ontextchanged d'un Asp: TextBox via Javascript

Eh bien, si vous ne voulez pas le faire avec Ajax ou quoi que ce soit d’autre et profiter de la publication normale d’ASP.NET, vous pouvez le faire (sans utiliser d’autre bibliothèque):

Dans le fichier de code, si vous utilisez C# et .NET 2.0 ou supérieur, ajoutez l’interface suivante à la classe Page, de sorte qu’elle ressemble à ceci :

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

Ensuite, vous devez ajouter cette fonction à votre fichier de code.

public void RaisePostBackEvent(string eventArgument) {}

Écrivez le code suivant dans votre événement onclick en JavaScript.

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

Le fichier de code appelle alors la méthode RaisePostBackEvent avec l’argument eventArgument, comme argument String passé par JavaScript. Vous pouvez maintenant appeler n’importe quel autre événement que vous voulez.

Voici la solution possible au problème.

WebForm1.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="textbox.WebForm1" %>

<!DOCTYPE html>
<html xmlns="https://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>

   <script type="text/javascript">
    function RefreshIt(selectObj) {
      __doPostBack('<%= Page.ClientID %>', selectObj.name);
    }
   </script>
<body>
  <form id="form1" runat="server">
  <div>
     <asp:TextBox runat="server" AutoPostBack="True" ID="txtG1" OnTextChanged="txtG1_TextChanged"
      onmouseout="javascript:RefreshIt(this);" ></asp:TextBox>
    <br />
    &nbsp;<asp:Label ID="Label1" runat="server" Font-Size="Large"></asp:Label>

  </div>
  </form>
</body>
</html>

Lorsque vous exécutez du code dans le navigateur, vous obtenez le résultat suivant :

Lancer l’événement Ontextchanged d’un Asp: TextBox via Javascript

lorsque vous entrez le texte dans le champ de saisie, il déclenchera l’événement ontextchange et donnera une sortie (c’est-à-dire en couleur rouge) comme ceci :

Lancer l’événement Ontextchanged d’un Asp: TextBox via Javascript - événement ontextchange

Vous pouvez changer la fonction RefreshIt en postback comme argument.

Vous devrez peut-être connaître le code qui fonctionne derrière et ajouter IPostBackEventHandler à la page et gérer la fonction RaisePostBackEvent.

WebForm1.aspx.cs

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

namespace textbox {
  public partial class WebForm1 : System.Web.UI.Page, IPostBackEventHandler {
    protected void Page_Load(object sender, EventArgs e) {}

    public void RaisePostBackEvent(string Arg) {
      if (txtG1.ID == Arg)
        txtG1_TextChanged(txtG1, null);
    }

    protected void txtG1_TextChanged(object sender, EventArgs e) {
      Label1.Text = txtG1.Text;
      Label1.ForeColor = System.Drawing.Color.Red;
      Label1.BackColor = System.Drawing.Color.White;
    }
  }
}

Vous pouvez utiliser le code mentionné ci-dessous pour déclencher l’événement ontextchanged() de asp:TextBox via JavaScript.

Auteur: Shiv Yadav

Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.