Wie sollen Daten zwischen clientseitigem Javascript und C # -Code hinter einer ASP.NET-App übertragen werden?

Ich suche nach der effizientesten / Standardmethode zum Übertragen von Daten zwischen clientseitigem JavaScript-Code und C # -Code hinter einer ASP.NET-Anwendung. Ich habe die folgenden Methoden verwendet, um dies zu erreichen, aber sie fühlen sich alle ein bisschen verworren an.

Um Daten von JavaScript an den C # -Code zu übergeben, müssen Sie ausgeblendete ASP-Variablen festlegen und ein Postback auslösen:

<asp:HiddenField ID="RandomList" runat="server" />

function SetDataField(data) {
      document.getElementById('<%=RandomList.ClientID%>').value = data;
}

Dann sammle ich im C # -Code die Liste:

protected void GetData(object sender, EventArgs e)
{
      var _list = RandomList.value;
}

Umgekehrt benutze ich oft einen der beiden ScriptManager, um eine Funktion zu registrieren und ihre Daten während Page Load weiterzugeben:

ScriptManager.RegisterStartupScript(this.GetType(), "Set","get("Test();",true);

oder ich füge den Steuerelementen Attribute vor einem Beitrag zurück oder während der Initialisierungs- oder Vorbereitungsphase hinzu:

Btn.Attributes.Add("onclick", "DisplayMessage("Hello");");

Diese Methoden haben mir gute Dienste geleistet und machen den Job, aber sie fühlen sich einfach nicht vollständig an. Gibt es eine Standardmethode zum Übertragen von Daten zwischen clientseitigem JavaScript und C # -Back-End-Code?

Ich habe einige Posts wie diesen gesehen , die die HtmlElement-Klasse beschreiben. Ist das etwas, worauf ich achten sollte?

Sie können einfach und problemlos eine statische Seitenmethode aus JavaScript aufrufen, wie in diesem Beispiel . Wenn Sie die Methode von mehreren Seiten aus aufrufen müssen, können Sie einen Webdienst einrichten und ihn auf dieselbe Weise über Javascript aufrufen. Beispiel siehe auch unten.

ASPX-Code

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

Code-Behind-Code

using System.Web.Services;

[WebMethod]
public static string MyMethod(string name)
{
    return "Hello " + name;
}

Javascript-Code

function test() {
    alert(PageMethods.MyMethod("Paul Hayman"));
}

HINWEIS: Die Seitenmethoden müssen statisch sein. Dies kann für Sie problematisch sein, je nachdem, was die Anwendung versucht. Wenn die Informationen jedoch auf einer Sitzung basieren und Sie eine Art integrierte Authentifizierung verwenden, können Sie dem WebMethod-Dekorator ein EnableSession-Attribut hinzufügen. Auf diese Weise können Sie auf HttpContext.Current.User zugreifen. Sitzung usw.

Ich würde empfehlen, sich jQuery anzuschauen. JQuery kann verwendet werden, um AJAX-Aufrufe an den Server zu senden, die Daten in jedem gewünschten Format zurückgeben können. Ein gutes Format könnte JSON sein, da es direkt in Javascript verwendet werden kann.

Um mit jQuery Daten vom Server auf Javascript herunter zu laden, senden die folgenden Abrufe eine asynchrone Anforderung an http://youserver.com/my/uri und empfangen die Daten vom Server in der angegebenen Funktion.

$.get("my/uri", 
    function(data) { 
       // client side logic using the data from the server
    })

Das Senden von Daten aus Javascript an den Server funktioniert ähnlich:

$.post("my/uri", { aValue : "put any data for the server here" }
    function(data) { 
       // client side logic using the data returned from the server
    })

Microsoft hat das UpdatePanelSteuerelement dazu veranlasst, Ajax zu verwenden, so dass dies wohl der "Standard" ist. Ich persönlich würde es jedoch nicht empfehlen, es hat nicht annähernd die reichhaltigen Funktionen und Steuerelemente, die Sie haben, wenn Sie JavaScript direkt verwenden.

So mache ich es persönlich:

Erstellen Sie ausgeblendete Felder für alle clientseitigen Werte, die Sie in einem Standardseiten-Postback verwenden möchten (z. B. wenn der Benutzer auf Senden klickt).

<asp:HiddenField ID="selectedProduct" runat="server" />

Registrieren Sie im Code dahinter die Steuerelemente, die Sie clientseitig verwenden möchten.

    /* Register the controls we want to use client side */

    string js = "var productBox = document.getElementById('" + selectedProduct.ClientID + "'); ";
    js += "var macCodeBoxBE = document.getElementById('" + beMacCode.ClientID + "'); ";


    ClientScript.RegisterStartupScript(this.GetType(), "prodBox", js, true);

Verwenden Sie eine JavaScript-Bibliothek *, um Ihren Ajax-Beitrag zu verfassen / abzurufen, und verwenden Sie dann JavaScript, um die Seite basierend auf der Antwort zu aktualisieren

$.get("../ajax/BTBookAppointment.aspx?dsl=" + telNumberBox.value + "&date=" + requiredDate.value + "&timeslot=" + ddTimeslot.value, function (response, status, xhr) {

    if (response.indexOf("not available") > -1) {
        loaderImage.src = "../images/cross.png"
        output.innerHTML = response;
    } });

Schreiben Sie eine separate "Ajax" -Seite, die die Render-Methode überschreibt, um die Arbeit zu erledigen.

protected override void Render(HtmlTextWriter writer)
{
    if (string.IsNullOrEmpty(Request["mac"])) { return; }
    if (string.IsNullOrEmpty(Request["dsl"])) { return; }
    DataLayer.Checkers.BTmacCheckResponse rsp = DataLayer.Checkers.Foo.CheckMAC(Request["dsl"], Request["mac"]);

    writer.Write(rsp.Valid.ToString());
}

* Es gibt viele Bibliotheken zur Auswahl, Sie können sogar Ihre eigenen rollen. Ich würde jQuery empfehlen , es ist stabil und hat einen umfangreichen Funktionsumfang.

JSON ist die beste Methode, um die Aufgabe auszuführen. Betrachten Sie das Problem nicht als Übergang zwischen "C # und JavaScript". Diese Art des Denkens führt zu Code-Kuriositäten wie dem, was Sie im ursprünglichen Beitrag haben.

Im Allgemeinen werden Objekte nur sprachunabhängig zwischen dem Client und dem Server übertragen. JSON eignet sich hervorragend für diese Aufgabe, da es weitgehend unterstützt wird und leicht zu lesen ist.

Um ein Eingabe-Tag festzulegen, für das kein serverseitiges ASP erforderlich ist, können Sie Folgendes verwenden: (oder <% #%> für die Formulardatenbindung)

html:

<input type="hidden" value='<%= RandomValues %>' name="RANDOM_VALUES" />

Asp-Kontrolle:

<asp:HiddenField ID="RandomList" runat="server" />

um die Werte nachträglich abzurufen

Request.Form["RANDOM_VALUES"]

Wenn es eine versteckte Eingabe gibt, können Sie sie verwenden

Request.Form[RandomList.UniqueID]

Der nette Teil von Request.Form ist, dass, wenn Sie mehrere Tags mit demselben Attribut "name" haben, das Ergebnis in CSV zurückgegeben wird.