Solved

Java Script Give Post back to Client Side Controls

Posted on 2010-11-17
8
453 Views
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

Exsample:

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.
0
Comment
Question by:JCWEBHOST
  • 4
  • 2
  • 2
8 Comments
 
LVL 20

Expert Comment

by:Proculopsis
ID: 34154167

Try simultaneously loading the label value into a hidden field.
0
 

Author Comment

by:JCWEBHOST
ID: 34154188
how you do that?
0
 

Author Comment

by:JCWEBHOST
ID: 34154265
sorry, how do you do that?
0
 
LVL 20

Expert Comment

by:Proculopsis
ID: 34154319

Something like:

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

Open in new window

0
6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

 

Author Comment

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

Accepted Solution

by:
ddayx10 earned 500 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.
EX.
<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.
EX.
<%@ 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:
http://msdn.microsoft.com/en-us/library/ms223397.aspx

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 :)

Gluck!
****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';

			__doPostBack(btn.id,Lb1.innerHTML);

		}

    </script>

</head>

<body>

    <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;" />

    </form>

</body>

</html>

****ASPX.VB CODE BEHIND****

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

0
 
LVL 20

Expert Comment

by:ddayx10
ID: 34161672
Should have written an article...
0
 

Author Closing Comment

by:JCWEBHOST
ID: 34172040
Thanks
0

Featured Post

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

Suggested Solutions

Introduction This article shows how to use the open source plupload control to upload multiple images. The images are resized on the client side before uploading and the upload is done in chunks. Background I had to provide a way for user…
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
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…

747 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now