Go Premium for a chance to win a PS4. Enter to Win


Java Script Give Post back to Client Side Controls

Posted on 2010-11-17
Medium Priority
Last Modified: 2012-05-10
Hey Guys, i need to know how to give asp control updates from a java script?

like if i set a value in the java script, it must post back to value to the client side of the contol


I change a label value using a javascript, it changes fine but if i do a post back the label return to default. So i need a way to make sure the javascript writes the values to the client side so when i post back the label remailn the same.
Question by:JCWEBHOST
  • 4
  • 2
  • 2
LVL 20

Expert Comment

ID: 34154167

Try simultaneously loading the label value into a hidden field.

Author Comment

ID: 34154188
how you do that?

Author Comment

ID: 34154265
sorry, how do you do that?
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

LVL 20

Expert Comment

ID: 34154319

Something like:

document.getElementById("lableid").value = document.getElementById("hiddenformfield").value = "Label Text";

Open in new window


Author Comment

ID: 34154362
and how i set the value when a postback is done?
LVL 20

Accepted Solution

ddayx10 earned 2000 total points
ID: 34161667
The hidden field doesn't really help you here if you need to retain the value after a postback. It will have the same limitation as the original label did. This can be quite a complex issue for a variety of reasons.

How you intend to cause a postback is a factor. When your JS changes the label's value does a postback always occurr, or is JS potentially changing a whole lot of stuff and then the user is posting back at some point(s)? What is causing the postback? Are there multiple elements that could cause a postback?

ASP.NET has a method for causing postbacks from JS, and since version 2.0 it has security turned on to prevent JS from posting back without proper authorization ( thank the bad hackers for this ).

I'm sure I'm opening a can of worms, but I'll attempt it anyway...refer to the code below(it is put together in its most basic form for readability).

In the code sample below I am using the JS __doPostBack() method to send data from JS to the server, where it is picked up and distributed back to the label in question. This allows me to change something, or pickup on a change made in JS and retain it accross postbacks.

In this sample though, two postbacks are occurring when the button is pressed. The first is when the JS event is fired and that postback occurs. After that happens the button's server-side click event fires and the page is posted back again...kindof undesirable.

So I can elmininate the second postback by returning false  from the JS event ChangeLbl.
<asp:Button ID="Bt1" runat="server" Text="Update" OnClientClick="ChangeLbl(this); return false;" />

The second I do this I will get a big 'ol error message from .NET telling me I now I have an "Invalid Postback Argument or Callback"...nice! This is easy enough to fix. Simply change the security setting for the page and it will work.
<%@ Page Language="VB" AutoEventWireup="false" EnableEventValidation="false" CodeFile="JSViewState.aspx.vb" Inherits="JSViewState" %>

The problem is I now have a guilty conscience for breaking the security of my page. If I can live with that I've solved my problem. If I can't then I have to go through the trouble of registering my postback control with my page so that I can use it in this manner. This would seem to be trivial, but in fact it is a bit of a pain.

For detailed sample see this:

In short if I am doing something simple like tracking one label's text that was changed in JS then this is not so bad, but if I want to track multiple JS elements being changed I am going to have to plan and organize my JS and my server code carefully to pull this off. Usually by the time I get here I start to re-think how I am trying to accomplish something. I might decide AJAX is a good solution, etc.

That may not be the answer you wanted, and someone may have a better idea, but that is my experience with this issue in as small of a nutshell as I can cohesively put it :)

****ASPX PAGE****
<%@ Page Language="VB" AutoEventWireup="false" EnableEventValidation="false" CodeFile="JSViewState.aspx.vb" Inherits="JSViewState" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript">
		function ChangeLbl(btn)
			var Lb1 = document.getElementById('Lb1');
			Lb1.innerHTML = 'Updated';
    <form id="form1" runat="server">
    <%--NOTE the scriptmanager or another server control that is not a button or a linkbutton is required for this to work--%>
    <asp:ScriptManager ID="sm" runat="server" />
    <asp:Label ID="Lb1" runat="server" />
    <asp:Button ID="Bt1" runat="server" Text="Update" OnClientClick="ChangeLbl(this); return false;" />
Partial Class JSViewState
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        Dim eTarget As String = Request.Params.Get("__EVENTTARGET") 'ID of control that send the __doPostBack
        Dim eArg As String = Request.Params.Get("__EVENTARGUMENT") 'Arguement of __doPostBack method

        'I didn't need to show both above I was just trying to show what is happening more clearly.
        'we are sending our JS updated string through the __EVENTARGUMENT

        If Not String.IsNullOrEmpty(eTarget) And Not String.IsNullOrEmpty(eArg) Then
            Lb1.Text = eArg
        End If
    End Sub
End Class

Open in new window

LVL 20

Expert Comment

ID: 34161672
Should have written an article...

Author Closing Comment

ID: 34172040

Featured Post

New feature and membership benefit!

New feature! Upgrade and increase expert visibility of your issues with Priority Questions.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

926 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question