web-dev-qa-db-ja.com

ASP.NETアプリの背後にあるクライアント側のJavascriptとC＃コードの間でデータをどのように渡す必要がありますか？

ASP.NETアプリケーションの背後にあるクライアント側のJavaScriptコードとC＃コードの間でデータを渡す最も効率的で標準的な方法を探しています。私はこれを達成するために以下の方法を使用してきましたが、それらはすべて少しファッジを感じています。

JavaScriptからC＃コードにデータを渡すには、hidden ASP変数を設定し、ポストバックをトリガーします。

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

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

次に、C＃コードでリストを収集します。

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

逆に言うと、ScriptManagerを使用して関数を登録し、Page_Load中にデータを渡します。

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

または、ポストバックの前、または初期化またはプリレンダリングの段階で、コントロールに属性を追加します。

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

これらの方法は私によく役立ち、仕事をしましたが、それらは完全ではないと感じています。クライアント側のJavaScriptとC＃のバックエンドコードの間でデータを渡すより標準的な方法はありますか？

HtmlElementクラスを説明する this one のような投稿をいくつか見ました。これは私が調べなければならないものですか？

web-developmentc#.netjavascriptasp.net
21
cwc1983

この例 のように、JavaScriptから静的ページメソッドを簡単かつ簡単に呼び出すことができます。複数のページからメソッドを呼び出す必要がある場合は、Webサービスをセットアップして、同じ方法でJavaScriptから呼び出すことができます。例も以下に含まれています。

.aspxコード

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

コードビハインドコード

using System.Web.Services;

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

JavaScriptコード

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

注：ページメソッドは静的である必要があります。これは、アプリケーションが何をしようとしているかに応じて、問題になる可能性があります。ただし、情報がまったくセッションに基づいており、何らかの組み込み認証を使用している場合は、WebMethodデコレーターにEnableSession属性を配置すると、HttpContext.Current.Userで取得できるようになります。セッション等.

9
Kasey Speakman

JQueryをご覧になることをお勧めします。 JQueryを使用してAJAXをサーバーに呼び出すことができます。これにより、必要な任意の形式でデータを返すことができます。JavaScriptで直接使用できるため、JSONが適切な形式です。

jQuery を使用してサーバーからjavascriptにデータをプルするには、次のフェッチで http://youserver.com/my/uri への非同期リクエストを作成し、提供された関数内のサーバー。

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

JavaScriptからサーバーへのデータ送信も同様に機能します。

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

JSONは、タスクを実行するための最良の方法です。問題を「C＃とJavaScript」の間の受け渡しと見なさないでください。この考え方は、元の投稿にあるような奇妙なコードにつながります。

より一般的には、言語にとらわれない方法でクライアントとサーバーの間でオブジェクトを渡すだけです。 JSONは広くサポートされており、読みやすいため、タスクに最適です。

3
P.Brian.Mackey

MicrosoftはUpdatePanelコントロールを実装してajaxを実行しているため、これは間違いなく「標準」の方法です。個人的にはお勧めしませんが、JavaScriptを直接使用する場合の豊富な機能セットとコントロールに近いものはありません。

これは私が個人的に行う方法です：

標準ページのポストバックで使用するクライアント側の値の非表示フィールドを作成します（つまり、ユーザーが送信を押したとき）

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

コードビハインドで、クライアント側で使用するコントロールを登録します。

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

JavaScriptライブラリ*を使用してajaxの投稿/取得を行い、JavaScriptを使用して応答に基づいてページを更新します

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

renderメソッドをオーバーライドして作業を行う別の「ajax」ページを作成します。

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

*豊富なライブラリから選択できます。自分で作成することもできます。私は jQuery をお勧めします。安定しており、広範な機能セットを備えています。

3
Tom Squires

サーバーサイドASPを必要としない入力タグを設定するには、以下を使用できます（またはフォームのデータバインディングの場合は<％＃％>）。

html：

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

aSPコントロール：

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

ポストバックの値を取得する

Request.Form["RANDOM_VALUES"]

その場合、ASPコントロールの非表示の入力は、使用できます

Request.Form[RandomList.UniqueID]

Request.Formの優れた点は、同じ「name」属性を持つ複数のタグがある場合、CSVで結果が返されることです。

2
MackPro