web-dev-qa-db-fra.com

Définir la propriété Text de asp: label en Javascript de manière appropriée

J'ai une série de zones de texte sur un formulaire. Lorsque l'utilisateur insère des nombres dans ces zones de texte, les calculs sont effectués et <asp:Label> les contrôles sont mis à jour via JavaScript pour refléter ces calculs:

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

Cela met correctement à jour l'interface utilisateur. Cependant, lorsque j'essaie d'accéder à la valeur dans le codebehind, la propriété Text est vide. Cela a du sens, je suppose, puisque je mettais à jour la propriété innerHTML via JavaScript.

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

Comment mettre à jour la propriété Text de <asp:Label> via JavaScript de manière à pouvoir lire la propriété dans le codebehind?

Mise à jour

Il s'agit d'un petit problème sur un grand formulaire qui contient 41 étiquettes, chacune affichant les résultats de certains calculs pour l'utilisateur. En suivant les conseils de FishBasketGordo, j'ai converti mon <asp:Label> à un handicapé <asp:TextBox>. Je définis la valeur de la nouvelle zone de texte en tant que telle:

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

Encore une fois, dans le codebehind, la valeur de TotalLoans.Text est toujours égal à "".


Cela ne me dérange pas de changer mon approche, mais voici le nœud du problème.

J'utilise JavaScript pour manipuler les valeurs de propriété de certains contrôles. J'ai besoin d'être en mesure d'accéder à ces valeurs manipulées à partir du code derrière lorsque "Soumettre" est cliqué.

Un conseil comment je peux y arriver?

Mise à jour 2

Concernant la réponse de @James Johnson, je ne suis pas en mesure de récupérer la valeur en utilisant .innerText propriété comme suggéré. J'ai EnableViewState mis à true sur le <asp:Label>. Y a-t-il autre chose qui me manque?

Je ne comprends pas pourquoi, lorsque je tape dans une zone de texte et soumets le formulaire, je peux accéder à la valeur dans le code derrière, mais lorsque je modifie par programme le texte d'une zone de texte ou d'une étiquette via JavaScript, je ne peux pas accéder à la nouvelle valeur .

20
splatto

Placez HiddenField Control dans votre formulaire.

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

Créer une propriété dans le formulaire

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

Mettre à jour la valeur du champ caché à partir de JavaScript

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

Vous pouvez maintenant accéder à la propriété directement à travers le Postback. La valeur Label Control mise à jour sera perdue sur PostBack au cas où elle serait utilisée directement dans le code derrière.

16
Pankaj

Celui-ci fonctionne pour moi avec le contrôle d'étiquette asp.

 function changeEmaillbl() {


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

Utilisez le code suivant

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

Javascript

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

C #

sptext.innerHTML
2
Venkata Pratap

Puisque vous avez mis à jour votre côté client d'étiquette, vous aurez besoin d'un post-back pour que votre code côté serveur reflète les changements.

Si vous ne savez pas comment faire cela, voici comment je l'ai fait par le passé.

Créez un champ caché:

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

Créez un bouton auquel sont associées à la fois des fonctions côté client et côté serveur. Votre fonction côté client remplira votre champ caché et le côté serveur le lira. Assurez-vous que votre côté client est appelé en premier.

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

Fonction côté client Javascript:

function TestSubmit() {
              try {

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

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

          }

      }

Fonction côté serveur C #

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

J'espère que cela t'aides!

1
clamchoda

Au lieu d'utiliser un Label utilisez une entrée de texte:

<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

Les informations de l'étiquette sont stockées dans l'entrée ViewState lors de la publication (gardez à l'esprit que le serveur ne sait rien de la page en dehors des valeurs de formulaire publiées, ce qui inclut le texte de votre étiquette). savoir ce qui a changé dans cette étiquette, ce qui, je suppose, ne vaut pas la peine.

Je ne sais pas exactement quel problème vous essayez de résoudre ici, mais cela pourrait vous donner quelques idées sur la façon de procéder:

Vous pouvez créer un champ masqué pour accompagner votre étiquette, et chaque fois que vous mettez à jour votre étiquette, vous devez également mettre à jour cette valeur. .

0
John

Le code Asp.net s'exécute d'abord sur le serveur, puis la page est rendue au client (navigateur). Codebehind n'a pas accès au côté client (javascript, html) car il ne vit que sur le serveur.

Donc, utilisez ajax et envoyez la valeur de label pour coder derrière. Vous pouvez utiliser PageMethods, ou simplement publier la page sur le serveur où réside codebehind, afin que codebehind puisse connaître la valeur mise à jour :)

0
Jashwant