how can i use javascript variable value in asp.net button click

Question

Given

<asp:Label ID="lbldistance" runat="server"></asp:Label>

I am assigning it the value with:

var distance = response.rows[0].elements[0].distance.text;
document.getElementById('<%=lbldistance.ClientID%>').innerHTML=distance;

I want to assign lbldistance value in textbox

protected void btnValue_Click(object sender, EventArgs e)
{
    txtJSValue.Text = lbldistance.Text;
}

but when i click the btnValue, lbldistance value disappears and i don't see the value in the TextBox..

Answer 1

I am afraid you cannot do that with a label. In ASP.NET state is kept in ViewState across postback. An ASP.NET <asp:Label> is rendered into an HTML span and a span does not have ViewState . Therefore, when you change the innerHTML of the label, you are actually changing the innertHTML of the span tag. Once you press the button, the page is posted to the server where the Label is constructed and it is constructed with the initial text, NOT the one you think it should since it was changed for a span . This (not keeping ViewState for a label), I think, is done for a good reason:

An HTML label should display something to the user and it is not meant to be changed by the user so there is no point in keeping the state across postback.

To accomplish what you want, use a hidden field like this:

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

Your javascript:

var distance = response.rows[0].elements[0].distance.text;
// Assign distance to your label so it shows on the page
document.getElementById('<%=lbldistance.ClientID%>').innerHTML=distance;

// Assing distance to hidden field so you can get it on the server side
document.getElementById('<%=HiddenField1.ClientID%>').value = distance;

Here is how to get the value on the server side:

 txtJSValue.Text = this.HiddenField1.Value;

---

I am not sure why you are going all the way to the server to change the Text of the txtJSValue textbox. You can do that easily on the browser side the same as you are setting the label:

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