getElementById not retreiving values from ASP textbox (radwindow, live demos)

[wnl]

Hi,
in this live demo http://demos.telerik.com/aspnet-ajax/window/examples/dialogreturnvalue/defaultcs.aspx you  opening a dialog from another dialog and ensuring the communication between them and the parent page.
But you are using "normal controls"  without masterpage eg.

<input type="text" style="width: 100px;" id="cityName" value="Sofia" />

My question is how to send value to asp.net control which has a code:

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

When I looked at the source code on the actual webpage the textbox id changed from TextBox1 to ctl00_EditPH_TextBox1.
Why id is changed (master pages?)?
Therefore I can't use javascript function (error):

function populateCityName(arg)
        {
           var cityName = document.getElementById("TextBox1");
           cityName.value = arg;
        }

It works fine when I wrote: getElementById("ctl00_EditPH_TextBox1").
But I have lots controls and look every time to source page is annoying.
How to avoid this?

[Shinu]

Hi Jaromin,

You could place the client side function in masterpage (call the function from content page) and try the following code in order to get client side object of TextBox. I hope this would be of help.

JavaScript:

<script type="text/javascript">
function getvalue1()
{
    var cityName = document.getElementById('<%=TextBox1.ClientID%>');
    alert(cityName.value);
}
</script>

-Shinu.

[wnl]

Thanks for reply.
My next question is about extended js files. I want to move all code js into one file js.
Eg. in this solution I moved a function returnValue() from Dialog2.aspx to file functions.js and I changed 
from

<input type="button" onclick="returnValue(); return false;" value="OK" />

to

 

<input type="button" onclick="returnValue2(); return false;" value="OK" />

and in added Dialog2.aspx

 

function returnValue2()
{
$telerik.$.getScript(functions.js');
}

  

 

 

 

And functions.js is: 

 

 

//get the RadComboBox's selected item's text



var combo = $find("<%= RadComboBox1.ClientID %>");

var selectedCapital = combo.get_text();

//Get a reference to the parent page (Default.aspx)



var oWnd = GetRadWindow();

//get a reference to the second RadWindow



var dialog1 = oWnd.get_windowManager().getWindowByName("RadWindow1");

// Get a reference to the first RadWindow's content



var contentWin = dialog1.get_contentFrame().contentWindow

//Call the predefined function in Dialog1



//contentWin.populateCityName(selectedCapital);



contentWin.document.getElementById("cityName").value = selectedCapital ;

//Close the second RadWindow

oWnd.close();

  

 

 

Now the name fo the city in Dialog1.aspx doesn't update.
Why moved code js to extended file crashs the application (error 'combo' is null or it's not an object)?
Is it possible to have js in one files?

 

[Fiko]

Hi Jaromin,

This is a common ASP.NET behavior and it is not related to our controls.
In your code you use server-side parentheses in order to retrieve the ClientID of a server control - RadComboBox1. Please note that the code inside the parentheses is evaluated by using the RadComboBox1 object from the server. In case that this code

var combo = $find("<%= RadComboBox1.ClientID %>");

is moved in a external JS file (such as in your case), then the highlighted expression will be evaluated as a string. For example if you call the following code :

alert("<%= RadComboBox1.ClientID %>");

the result will be "<%= RadComboBox1.ClientID %>" not the ClientID of the RadComboBox1.
This is why you need to leave the code that uses server parentheses on the .aspx page.

I hope this helps.

Sincerely yours,
Fiko
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.