server html control confusion

V

VBAHole22

Contributor
Joined
Oct 21, 2003
Messages
432
Location
VA
I have a js function that needs to run client side and access two values from the form. I need to be able to set those values from the server in code behind.
So the flow would go like this:

user clicks a button
server gathers 2 values
values get assigned to form controls
post back
user clicks another button
clientside js function runs using the two values in the form

My problem is I don't know how to pass the values in a format that both the server and the client will like.

If I put the values in server asp textboxes then the names of the controls get changed to things like 'ctl00_myControl' and the js can't find them (using document.getElementById("myControl").value;)

If I put the values in html controls like
<input id="TextX" name="TextX" type="text" value="myx" />
the js can see them but I have no way of assigning new values to the controls on the server side.

Am I missing something simple here. Probably.
 
I traditionally on things like this have a start up script that sets a variable that is used by the javascript function that does the work - the variable being the id of the element to get with the getElementById function. In the startup script I pass the ClientID so that javascript knows the correct ID.
 
Could you post this script? So you are getting a handle on the .NET assigned controlId? How do you go about doing that.

Oddly enough I am seeing different behavior from vs03. There I have a textbox like so

Code: 
<form id="form1" runat="server">
<div style="display: none">
<asp:TextBox ID="type" name="type" Runat="server" />
<asp:TextBox ID="query" name="query" Runat="server" />
</div>
</form>

That gets translated into this when you view source


Code: 
<form name="form1" method="post" action="sds.aspx" id="form1">
<input type="hidden" name="__VIEWSTATE" value="dDwtMTQ2MTg3NDI4MTs7PvF/AkpMXGNL6FSZVK3jonOJoWfY" />
<div style="display: none">
<input name="type" type="text" id="type" name="type" />
<input name="query" type="text" id="query" name="query" />
</div>
</form>


This would be alright for me because js could find the control. But in vs05 my html is

Code: 
<div style="display: none">
	<asp:TextBox ID="x" name="x" Runat="server" />
	<asp:TextBox ID="y" name="y" Runat="server" />
</div>

And it is rendering as:

Code: 
 <div style="display: none">
<input name="ctl00$mainContent$x" type="text" value="37.524047" id="ctl00_mainContent_x" name="x" />
<input name="ctl00$mainContent$y" type="text" value="-77.448175" id="ctl00_mainContent_y" name="y" />
</div>

Isn't that odd? When i write the html it complains about the name tag saying it is not valid. But it renders it.

The js I am trying to use is:

var x = document.getElementById("x").value;

Is there a getElementByName or something similar I could use?
 
In code (on PreRender):

C#: 
Page.RegisterStartUpScript("Init", "InitVars('" + this.txtInput1.ClientID + "'");

In Page:

Code: 
<script language="javascript" type="text/javascript">
    var inputIDElement;
    function InitVars(id)
    {
           inputIDElement = document.getElementById(id);
    }
    function SomeOtherFunction
    {
           if(inputIDElement)
              inputIDElement.Text = 'asdf';
    }
</script>

My syntax may be off since I'm going by memory.

NOTE: Sometimes because of the parent control (container) I have use UniqueID - but usually ClientID will work fine.
 
Back
Top