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

20

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

Per passare i dati da JavaScript al codice C # è possibile impostare variabili ASP nascoste e attivare un postback:

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

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

Quindi nel codice C # raccolgo la lista:

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

Tornando all'altra modalità, utilizzo spesso ScriptManager per registrare una funzione e trasmetterla 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 ho svolto il lavoro, ma semplicemente non mi sento completo. Esiste un modo più standard per trasmettere i dati tra codice JavaScript lato client e codice back-end C #?

Ho visto alcuni post come questo che descrive HtmlElement class; è questo qualcosa che dovrei esaminare?

    
posta cwc1983 29.11.2011 - 18:23
fonte

5 risposte

9

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.

.aspx Code

<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 tentando di fare. Tuttavia, se le informazioni sono basate sulla sessione e si utilizza un'autenticazione integrata, è possibile inserire un attributo EnableSession nel decoratore WebMethod e ciò consente di accedere a HttpContext.Current.User, Sessione, ecc.

    
risposta data 02.01.2012 - 06:02
fonte
3

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

Per trasferire i dati dal server a javascript utilizzando jQuery , i seguenti recuperi rendono una richiesta asincrona a link 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
    })
    
risposta data 29.11.2011 - 22:12
fonte
3

Microsoft ha implorato il controllo UpdatePanel per fare ajax, quindi è discutibilmente il modo "standard". Non lo consiglierei personalmente di usarlo, ma non ha nulla a che vedere con il ricco set di funzionalità e il controllo che hai quando usi JavaScript direttamente.

Questo è il modo in cui lo faccio personalmente:

Crea campi nascosti per qualsiasi valore del lato client che desideri utilizzare in un postback di pagina standard (ovvero quando l'utente preme Invio)

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

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

Utilizza una libreria javascript * per fare il tuo post ajax / ottenere poi utilizzare 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" seprata 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 un sacco di librerie tra cui scegliere, puoi persino creare il tuo personale. Vorrei raccomandare jQuery , è stabile e ha un ampio set di funzionalità.

    
risposta data 30.11.2011 - 10:39
fonte
2

Per impostare un tag di input che non ha bisogno di asp di server, puoi utilizzare: (o <% #% > per la form di associazione dei dati)

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 input di controllo nascosto, puoi usare

Request.Form[RandomList.UniqueID]

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

    
risposta data 29.12.2011 - 16:32
fonte
2

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 stranezze del codice come quello che hai nel post originale.

Più in generale, si tratta semplicemente di passare oggetti tra il client e il server in modo indipendente dal linguaggio. JSON è ottimo per l'attività perché è ampiamente supportato e facile da leggere.

    
risposta data 29.12.2011 - 16:40
fonte

Leggi altre domande sui tag