web-dev-qa-db-ja.com

JavaScriptの適切な方法でasp:labelのTextプロパティを設定します

フォームに一連のテキストボックスがあります。ユーザーがこれらのテキストボックスに数値を挿入すると、計算が行われ、<asp:Label>コントロールがJavaScriptを介して更新され、これらの計算が反映されます。

document.getElementById('<%=TotalLoans.ClientID %>').innerHTML = TotalLoans;

これにより、UIが正しく更新されます。ただし、分離コードの値にアクセスしようとすると、Textプロパティが空です。 JavaScriptを介してinnerHTMLプロパティを更新していたため、これは理にかなっています。

//TotalLoans.Text will always be equal to "" in this scenario
double bTotalLoans = string.IsNullOrEmpty(TotalLoans.Text) 
                   ? 0.00 
                   : Convert.ToDouble(TotalLoans.Text);

分離コードのプロパティを読み取ることができるように、JavaScriptを介して<asp:Label>Textプロパティを更新するにはどうすればよいですか?

更新

これは、41個のラベルを含む大きなフォームでは小さな問題です。各ラベルには、ユーザーの計算結果が表示されます。 FishBasketGordoのアドバイスを受けて、<asp:Label>を無効な<asp:TextBox>に変換しました。新しいテキストボックスの値を次のように設定しています:

    document.getElementById('<%=TotalLoans.ClientID %>').value = TotalLoans;

繰り返しますが、分離コードでは、TotalLoans.Textの値は常に ""に等しくなります。


これにアプローチする方法を変えても構いませんが、問題の核心はここにあります。

JavaScriptを使用して、一部のコントロールのプロパティ値を操作しています。 [送信]をクリックすると、コードビハインドからこれらの操作値にアクセスできる必要があります。

これについてどうすればよいですか?

更新2

@James Johnsonの回答に関して、提案された.innerTextプロパティを使用して値を取得することはできません。 <asp:Label>EnableViewStateをtrueに設定しています。私が行方不明になっているものは他にありますか?

テキストボックスに入力してフォームを送信すると、コードビハインドの値にアクセスできる理由がわかりませんが、JavaScriptを使用してテキストボックスまたはラベルのテキストをプログラムで変更すると、新しい値にアクセスできません。

20
splatto

HiddenFieldコントロールをフォームに配置します。

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

フォームにプロパティを作成する

protected String LabelProperty
{
    get
    {
        return hidden.Value;
    }
    set
    {
        hidden.Value = value;
    }
}

JavaScriptから非表示フィールドの値を更新します

<script>
   function UpdateControl() {
            document.getElementById('<%=hidden.ClientID %>').value = '12';
   }
</script>

これで、Postbackを介して直接プロパティにアクセスできます。 Label Controlの更新された値は、コードビハインドで直接使用されている場合、PostBack全体で失われます。

16
Pankaj

これはaspラベルコントロールで私のために動作します。

 function changeEmaillbl() {


         if (document.getElementById('<%=rbAgency.ClientID%>').checked = true) {
             document.getElementById('<%=lblUsername.ClientID%>').innerHTML = 'Accredited No.:';
         } 
     }
4
Vijay Kumbhoje

次のコードを使用してください

<span id="sptext" runat="server"></span>

Javaスクリプト

document.getElementById('<%=sptext'%>).innerHTML='change text';

C#

sptext.innerHTML
2
Venkata Pratap

ラベルクライアント側を更新したので、サーバー側のコードが変更を反映するためにポストバックが必要になります。

これを行う方法がわからない場合は、ここで過去にどのように行ったかを説明します。

非表示フィールドを作成します。

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />

クライアント側とサーバー側の両方の機能が接続されたボタンを作成します。あなたは、クライアント側の関数があなたの隠しフィールドに入力し、サーバー側がそれを読み込みます。クライアント側が最初に呼び出されていることを確認してください。

<asp:Button ID="_Submit" runat="server" Text="Submit Button" OnClientClick="TestSubmit();" OnClick="_Submit_Click" />

Javascriptクライアント側の機能:

function TestSubmit() {
              try {

             var message = "Message to Pass";
             document.getElementById('__EVENTTARGET').value = message;

           } catch (err) {
              alert(err.message);

          }

      }

C#サーバー側関数

protected void _Submit_Click(object sender, EventArgs e)
{
     // Hidden Value after postback
     string hiddenVal= Request.Form["__EVENTTARGET"];
}

お役に立てれば!

1
clamchoda

Labelを使用する代わりに、テキスト入力を使用します。

<script type="text/javascript">
    onChange = function(ctrl) {
        var txt = document.getElementById("<%= txtResult.ClientID %>");
        if (txt){
            txt.value = ctrl.value;
        }           
    }
</script>

<asp:TextBox ID="txtTest" runat="server" onchange="onChange(this);" />      

<!-- pseudo label that will survive postback -->  
<input type="text" id="txtResult" runat="server" readonly="readonly" tabindex="-1000" style="border:0px;background-color:transparent;" />        

<asp:Button ID="btnTest" runat="server" Text="Test" />
1
James Johnson

ラベルの情報は、ポストバックのViewState入力に保存されます(サーバーは、ラベルのテキストを含む、ポストバックされたフォーム値以外のページについては何も知らないことに注意してください)。そのラベルの変更点を知ってください。これはあなたの時間の価値はないと思います。

ここでどのような問題を解決しようとしているのか完全にはわかりませんが、これにより、その解決方法についていくつかのアイデアが得られる可能性があります。

ラベルに合わせて非表示フィールドを作成し、ラベルを更新するときはいつでも、その値も更新します。その後、コードビハインドでラベルのTextプロパティをその非表示フィールドに設定します。

0
John

Asp.netのコードビハインドは最初にサーバーで実行され、次にページがクライアント(ブラウザー)にレンダリングされます。 Codebehindはサーバー上にのみ存在するため、クライアント側(javascript、html)にアクセスできません。

そのため、ajaxを使用し、ラベルの値をコードビハインドに送信します。 PageMethodsを使用するか、単にコードビハインドが存在するサーバーにページを投稿するだけで、コードビハインドは更新された値を知ることができます:)

0
Jashwant