How to change the text of a label?

Question

I have a radiobutton list and on click on the radio button item I have to change the text of its label. But for some reason it's not working. Code is below:

<asp:Label ID="lblVessel" Text="Vessel:" runat="server"></asp:Label>

<script language="javascript">
  $(document).ready(function() {

    $('#rblDiv input').click(function() {
      var selected = $("#rblDiv input:radio:checked").val();
      if (selected == "exportpack") {
        $('#lblVessel').text("NewText");
      }
    });
  });
</script>

Answer 1

I was having the same problem because i was using

$("#LabelID").val("some value");

I learned that you can either use the provisional jquery method to clear it first then append:

$("#LabelID").empty();
$("#LabelID").append("some Text");

Or conventionaly, you could use:

$("#LabelID").text("some value");

OR

$("#LabelID").html("some value");

Answer 2

ASP.Net automatically generates unique client IDs for server-side controls.

Change it to

 $('#<%= lblVessel.ClientID %>')

In ASP.Net 4.0, you could also set the ClientIDMode property to Static instead.

Answer 3

Try this:

$('[id$=lblVessel]').text("NewText");

The id$= will match the elements that end with that text, which is how ASP.NET auto-generates IDs. You can make it safer using span[id=$=lblVessel] but usually this isn't necessary.

Answer 4

try this

$("label").html(your value); or $("label").text(your value);

Answer 5

<asp:RadioButtonList ID="rbtnType" runat="server">
    <asp:ListItem Value="C">Co</asp:ListItem>
    <asp:ListItem Value="I">In</asp:ListItem>
    <asp:ListItem Value="O">Out</asp:ListItem>
</asp:RadioButtonList>
<br />
<asp:Label ID="lblLabelName" runat="server"></asp:Label>
<script type="text/javascript">
    $(document).ready(function() {
        $("#<%=rbtnType.ClientID%>").change(function() {
            var rbvalue = $("input[@name=<%=rbtnType.ClientID%>]:radio:checked").val();
            if (rbvalue == "C") {
                $('#<%=lblLabelName.ClientID %>').html('text1');
            } else if (rbvalue == "I") {
                $('#<%=lblLabelName.ClientID %>').html('else text2');
            } else if (rbvalue == "O") {
                $('#<%=lblLabelName.ClientID %>').html('or elsethistext');
            }
        });
    });
</script>

Answer 6

we have to find label tag for attribute value based on that.we have replace label text.

Script:

<script type="text/javascript">
$(document).ready(function() 
{ 
$("label[for*='test']").html("others");
});

</script>

Html

<label for="test_992918d5-a2f4-4962-b644-bd7294cbf2e6_FillInButton">others</label>

You want to more details .Click Here

Answer 7

   lable value $('#lablel_id').html(value);

Answer 8

I just went through this myself and found the solution. See an ASP.NET label server control actually gets redered as a span (not an input), so using the .val() property to get/set will not work. Instead you must use the 'text' property on the span in conjuntion with using the controls .ClientID property. The following code will work:

$("#<%=lblVessel.ClientID %>").text('NewText');

Answer 9

$('#<%= lblVessel.ClientID %>').html('New Text');

ASP.net Label will be rendered as a span in the browser. so user 'html'.

Answer 10

Try this in JS:

Clicking on the label text toggles it with an alternative text, while selecting the associated input field and giving the focus to the same associated input field.

<script type="text/javascript">"use strict";
  const oldLabelText="ORIGINAL BUTTON TAG TEXT";
  document.write(
    '<label id=labId for=inputId onClick="changeText(this.id)">'+oldLabelText+'</label>:<br>'+
    '<input id="inputId" value="The input value" />'
  );
</script>

<script type="text/javascript">"use strict";
  const stat=[oldLabelText,"NEW LABEL TEXT","THIRD LABEL TEXT","FOURTH LABEL TEXT"];
  let   cptr=0;

  function changeText(button_id){
     var el = document.getElementById(button_id);

     el.textContent = stat[++cptr % (stat.length)];

  // or
  //       el.firstChild.data = stat[++cptr % (stat.length)];

  // or
  //        el.innerHTML = stat[++cptr % (stat.length)];

  // or simply
  //        el.innerHTML = "the new text";
  }
</script>