Come devono essere trasferiti i dati tra Javascript lato client e codice C # dietro un'app ASP.NET?

Sto cercando il modo più efficiente / standard di passare i dati tra il codice JavaScript lato client e il codice C # dietro un'applicazione ASP.NET. Ho usato i seguenti metodi per raggiungere questo obiettivo, ma si sentono tutti un po 'confusi.

Passare i dati da JavaScript al codice C # è impostando variabili ASP nascoste e attivando un postback:

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

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

Quindi nel codice C # raccolgo l'elenco:

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

Tornando indietro, uso spesso ScriptManager per registrare una funzione e passargli i dati durante Page_Load:

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

oppure aggiungo attributi ai controlli prima di un postback o durante le fasi di inizializzazione o pre-rendering:

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

Questi metodi mi hanno servito bene e fanno il lavoro, ma non si sentono completi. Esiste un modo più standard di passare i dati tra JavaScript lato client e codice back-end C #?

Ho visto alcuni post come questo che descrivono la classe HtmlElement; è qualcosa che dovrei esaminare?

Puoi semplicemente e facilmente chiamare un metodo di pagina statica da JavaScript come in questo esempio . Se è necessario chiamare il metodo da più pagine, è possibile impostare un servizio Web e chiamarlo da Javascript allo stesso modo. Esempio incluso anche di seguito.

Codice .aspx

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

Codice Code-behind

using System.Web.Services;

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

Codice Javascript

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

NOTA: i metodi di pagina devono essere statici. Questo potrebbe essere problematico per te, a seconda di ciò che l'applicazione sta cercando di fare. Tuttavia, se le informazioni sono basate sulla sessione e stai utilizzando una sorta di autenticazione integrata, puoi inserire un attributo EnableSession sul decoratore WebMethod e ciò ti permetterà di accedere a HttpContext.Current.User, Sessione, ecc.

Consiglierei di dare un'occhiata a jQuery. JQuery può essere utilizzato per richiamare AJAX sul server, che può restituire i dati in qualunque formato sia necessario: un buon formato potrebbe essere JSON, poiché può essere utilizzato direttamente in javascript.

Per estrarre i dati dal server in javascript utilizzando jQuery , i seguenti recuperi invia una richiesta asincrona a http://youserver.com/my/uri e riceve i dati dal server nella funzione fornita.

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

L'invio di dati da JavaScript al server funziona in modo simile:

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

Microsoft ha implorato il UpdatePanelcontrollo per fare Ajax in modo che sia probabilmente il modo "standard". Personalmente non consiglierei di usarlo, non ha nulla vicino al ricco set di funzionalità e al controllo che hai quando usi JavaScript direttamente.

Questo è il modo in cui lo faccio personalmente:

Creare campi nascosti per tutti i valori lato client che si desidera utilizzare in un postback di pagina standard (ovvero quando l'utente preme invia)

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

Nel codice dietro registra i controlli che desideri utilizzare sul lato 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);

Usa una libreria javascript * per pubblicare il tuo post ajax / get, quindi utilizza JavaScript per aggiornare la pagina in base alla risposta

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

Scrivi una pagina "ajax" separata che sovrascrive il metodo di rendering per eseguire il lavoro.

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

* Ci sono molte librerie tra cui scegliere, puoi persino creare le tue. Consiglierei jQuery , è stabile e ha una vasta gamma di funzionalità.

JSON è il modo migliore per eseguire l'attività. Non considerare il problema come un passaggio tra "C # e JavaScript". Questo modo di pensare porta a codificare stranezze come quello che hai nel post originale.

Più in generale, sta semplicemente passando oggetti tra il client e il server in modo agnostico. JSON è ottimo per l'attività perché è ampiamente supportato e di facile lettura.

Per impostare un tag di input che non necessita di asp lato server, è possibile utilizzare: (o <% #%> per il database dei moduli)

html:

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

controllo asp:

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

per ottenere i valori sul postback

Request.Form["RANDOM_VALUES"]

Se è, asp controllo input nascosto, è possibile utilizzare

Request.Form[RandomList.UniqueID]

La parte accurata di Request.Form è se hai più tag con lo stesso attributo "name", restituirà il risultato in CSV.