Como os dados devem ser transmitidos entre o Javascript do lado do cliente e o código C # atrás de um aplicativo ASP.NET?

Estou procurando a maneira mais eficiente / padrão de transmitir dados entre o código JavaScript do lado do cliente e o código C # atrás de um aplicativo ASP.NET. Eu tenho usado os seguintes métodos para conseguir isso, mas todos eles se sentem um pouco enganados.

Para passar dados do JavaScript para o código C # é definindo variáveis ​​ASP ocultas e acionando uma postagem:

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

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

Então, no código C #, coleciono a lista:

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

Voltando à outra maneira, costumo usar o ScriptManager para registrar uma função e transmitir dados durante o Page_Load:

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

ou adiciono atributos aos controles antes de uma postagem de retorno ou durante os estágios de inicialização ou pré-renderização:

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

Esses métodos me serviram bem e fazem o trabalho, mas simplesmente não parecem completos. Existe uma maneira mais padrão de transmitir dados entre o JavaScript do lado do cliente e o código de back-end em C #?

Eu já vi alguns posts como este que descrevem a classe HtmlElement; isso é algo que eu deveria procurar?

Você pode simplesmente e facilmente chamar um método de página estática do JavaScript, como neste exemplo . Se você precisar chamar o método de várias páginas, poderá configurar um serviço da Web e chamá-lo de Javascript da mesma maneira. Exemplo também incluído abaixo.

Código .aspx

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

Código Javascript

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

NOTA: Os métodos da página devem ser estáticos. Isso pode ser problemático para você, dependendo do que o aplicativo está tentando fazer. No entanto, se as informações se basearem na sessão e você estiver usando algum tipo de autenticação interna, poderá colocar um atributo EnableSession no decorador WebMethod e permitir que você acesse HttpContext.Current.User, Sessão, etc.

Eu recomendo dar uma olhada no jQuery. O JQuery pode ser usado para fazer chamadas AJAX de volta ao servidor, que pode retornar os dados no formato que você precisar - um bom formato pode ser JSON, pois pode ser usado diretamente em javascript.

Para extrair dados do servidor para javascript usando jQuery , as buscas a seguir fazem uma solicitação assíncrona para http://youserver.com/my/uri e recebem os dados do servidor na função fornecida.

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

O envio de dados de javascript para o servidor funciona da mesma forma:

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

A Microsoft implementou o UpdatePanelcontrole para executar o ajax, de modo que essa é sem dúvida a maneira "padrão". No entanto, eu não recomendaria pessoalmente usá-lo, pois ele não tem nem perto do rico conjunto de recursos e controle que você tem ao usar o JavaScript diretamente.

É assim que eu pessoalmente faço:

Crie campos ocultos para quaisquer valores do lado do cliente que você deseja usar em uma postagem de página padrão (ou seja, quando o usuário clicar em Enviar)

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

No código por trás, registre os controles que você deseja usar no lado do cliente.

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

Use uma biblioteca javascript * para fazer sua publicação / obtenção do ajax e, em seguida, use JavaScript para atualizar a página com base na resposta

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

Escreva uma página "ajax" separada que substitua o método de renderização para fazer o trabalho.

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

* Existem muitas bibliotecas para você escolher, você pode até criar suas próprias. Eu recomendaria o jQuery , é estável e possui um amplo conjunto de recursos.

JSON é a melhor maneira de realizar a tarefa. Não olhe para o problema como uma passagem entre "C # e JavaScript". Esse modo de pensar leva a códigos estranhos, como o que você tem na postagem original.

De maneira mais geral, é apenas passar objetos entre o cliente e o servidor de uma maneira independente da linguagem. O JSON é excelente para a tarefa porque é amplamente suportado e fácil de ler.

Para definir uma marca de entrada que não precise de asp no servidor, você pode usar: (ou <% #%> para vinculação de formulários)

html:

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

controle asp:

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

para obter os valores no postback

Request.Form["RANDOM_VALUES"]

Se o seu, asp controlar a entrada oculta, você pode usar

Request.Form[RandomList.UniqueID]

A parte interessante do Request.Form é que, se você tiver várias tags com o mesmo atributo "name", ele retornará o resultado em CSV.