Comment les données doivent-elles être transmises entre le Javascript côté client et le code C # derrière une application ASP.NET?

Je recherche le moyen le plus efficace / standard de passer des données entre le code JavaScript côté client et le code C # derrière une application ASP.NET. J'ai utilisé les méthodes suivantes pour y parvenir, mais ils se sentent tous un peu un fudge.

Pour passer des données de JavaScript au code C #, vous devez définir des variables ASP masquées et déclencher une publication:

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

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

Ensuite, dans le code C #, je recueille la liste:

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

Pour revenir en arrière, j'utilise souvent l'un ou l'autre ScriptManager pour enregistrer une fonction et lui transmettre des données pendant

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

ou j'ajoute des attributs aux contrôles avant un post ou pendant les étapes d'initialisation ou de pré-rendu:

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

Ces méthodes m'ont bien servi et font le travail, mais elles ne se sentent pas complètes. Existe-t-il un moyen plus standard de transmettre des données entre JavaScript côté client et le code back-end C #?

J'ai vu des articles comme celui-ci qui décrivent la classe HtmlElement; est-ce quelque chose que je devrais examiner?

Vous pouvez simplement et facilement appeler une méthode de page statique à partir de JavaScript comme dans cet exemple . Si vous devez appeler la méthode à partir de plusieurs pages, vous pouvez configurer un service Web et l'appeler à partir de Javascript de la même manière. Exemple également inclus ci-dessous.

Code .aspx

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

Code code-behind

using System.Web.Services;

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

Code Javascript

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

REMARQUE: les méthodes de page doivent être statiques. Cela pourrait être problématique pour vous, selon ce que l'application essaie de faire. Cependant, si les informations sont basées sur la session et que vous utilisez une sorte d'authentification intégrée, vous pouvez mettre un attribut EnableSession sur le décorateur WebMethod, et cela vous permettra d'accéder à HttpContext.Current.User, Session, etc.

Je recommanderais de jeter un œil à jQuery. JQuery peut être utilisé pour effectuer des appels AJAX vers le serveur, qui peut renvoyer des données dans le format dont vous avez besoin - un bon format pourrait être JSON, car il peut être utilisé directement en javascript.

Pour extraire des données du serveur vers javascript à l'aide de jQuery , les récupérations suivantes font une demande asynchrone à http://youserver.com/my/uri et reçoivent les données du serveur dans la fonction fournie.

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

L'envoi de données de javascript au serveur fonctionne de la même manière:

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

Microsoft a implémenté le UpdatePanel contrôle pour faire ajax, ce qui est sans doute la méthode "standard". Je ne recommanderais pas personnellement de l'utiliser, cependant, il n'a rien à voir avec le riche ensemble de fonctionnalités et le contrôle que vous avez lorsque vous utilisez directement JavaScript.

Voici comment je le fais personnellement:

Créez des champs masqués pour toutes les valeurs côté client que vous souhaitez utiliser dans une publication de page standard (c'est-à-dire lorsque l'utilisateur frappe soumettre)

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

Dans le code derrière, enregistrez les contrôles que vous souhaitez utiliser côté client.

    /* 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);

Utilisez une bibliothèque javascript * pour faire votre publication ajax / get puis utilisez JavaScript pour mettre à jour la page en fonction de la réponse

$.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;
    } });

Écrivez une page "ajax" séparée qui remplace la méthode de rendu pour effectuer le travail.

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());
}

* Il y a beaucoup de bibliothèques parmi lesquelles choisir, vous pouvez même rouler la vôtre. Je recommanderais jQuery , son stable et possède un ensemble de fonctionnalités étendu.

JSON est le meilleur moyen de réaliser la tâche. Ne regardez pas le problème comme un passage entre "C # et JavaScript". Cette façon de penser conduit à des bizarreries de code telles que ce que vous avez dans le message d'origine.

Plus généralement, il s'agit simplement de passer des objets entre le client et le serveur d'une manière indépendante du langage. JSON est idéal pour la tâche car il est largement pris en charge et facile à lire.

Pour définir une balise d'entrée qui n'a pas besoin d'asp côté serveur, vous pouvez utiliser: (ou <% #%> pour la liaison de données de formulaires)

html:

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

contrôle asp:

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

pour obtenir les valeurs sur postback

Request.Form["RANDOM_VALUES"]

Si son, asp contrôle l'entrée cachée, vous pouvez utiliser

Request.Form[RandomList.UniqueID]

La partie intéressante de Request.Form est que si vous avez plusieurs balises avec le même attribut "name", il retournera le résultat en CSV.