At what asp.net page event are clientIDs assigned? - asp.net

I want to do something like this:
Panel divPanel = new Panel();
divPanel.ID = "divPanel";
this.Page.Controls.Add(divPanel);
string script = "function alertID(){alert("the id is: "+divPanel.ClientID+");}";
this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "scripttests", script);
But when I put this code in page_load, I don't get the full id, which is ctl00_ContentMain_divPanel, I just get divPanel.
Is there another event I should use? How do I make this work?

PreRender is fine, however it should work in Page_Load as well.
http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientid(VS.71).aspx
Is your script rendering code running in page_load as well? They are together in your example above, but perhaps they were just copy/pasted together?
If this code is in a custom control, you also need to add the INamingContainer interface to the control declaration for ClientID to work as you expect:
http://msdn.microsoft.com/en-us/library/system.web.ui.inamingcontainer.aspx
Additionally, if this is a custom control, you should add to the Controls collection of the control itself, not the containing page. ie: this.Controls.Add() instead of this.Page.Controls.Add()

In your example you are adding directly to the Page controls collection. This would mean that the client id should be divPanel. Perhaps the client id you expect it to be is the incorrect one.

Related

Databinding to a property?

I'm using the following syntax to bind to a div element:
<div id="previewdiv"><%=Preview%></div>
Where Preview is a property on my page.
The catch is that I'm creating this in Javascript on a new page in an onclick event. On the server side, I'm able to reference the new page via this property but for some reason when the page is postback the variable is getting set to the default initialized value and not to the value that I set in my page, i.e Preview = string. When I postback a second time then the page will be updated with the value I set.
I could perhaps move the code to the Init but I need to get values from controls to Initialize this property.
Ideas?
The problem you're running into is that, using traditional ASP.NET Web Forms, <%= %> code is evaluated very early in the page lifecycle, before your code has had a chance to run.
Instead, you want to use ASP.NET Data Binding, which uses a different syntax, like this: <%# %>. (note the "#"). Then, to get this code to render, you've got to call the DataBind() of some server-side control when you're ready to replace the template with your actual data.
So in your server code you do something like this:
Preview = someString;
previewDiv.DataBind();
And in your markup, something like this:
<div runat=server id="previewdiv"><%#Preview%></div>

Access hiddenfield using Jquery

I have a page that's derived from a master page. On this page, I have a hiddenfield ("hfUser"). How can I access this "hfUser" control and get/set its value using JQuery?
I've tried variants of this:
$(document).ready(function() {
var test = $("#hfUser").val();
alert(test);
});
but test = undefined. I'm guessing I've got the selector wrong, but I don't know how to get an asp hiddenfield. Any ideas?
Thanks
If you are using Asp.net controls, the server will mangle the control ids. It adds a bunch of extraneous control tree hierarchy information into the id. You need to reference what that acutal id is that's getting rendered, which is availble with the ClientID property on the control (hfUser.ClientID) or access your control in a different, more roundabout way, like find the controls parent, then search through its children to find your control.
If you don't have to use the asp.net HiddenField control, try just using a regular old html input.
ASP does like to mangle ID's. The further down the rabbit hole (or nesting controls) you go, the more ASP adds to your control ID. Throw in Master Pages, and it's yet another level or two.
Another way to access server-side controls (with the runat property set), is to use the square brackets in your jQuery selector.
Like this:
$("[id$='hidImgSource']").val()
That selects any elements whose ID has 'hidImgSource' as ending part of the name. So it will find mangled ID's.
Here is a link to the jQuery Selectors page that explains some more options.
If the hidden field is an ASP.NET control, check out this blog post to help you with jQuery selectors for ASP.NET controls
http://www.foliotek.com/devblog/extending-jquery-to-select-asp-controls/
Do it like this:
$(document).ready(function()
{
var test = $("**#<%= hfUser.ClientID %>**").val();
alert(test);
});

Access html control from server side

How can i access html control from code behind in asp.net. I do not want to use "runat=server" as it is causing problems.
I have made an empty html table and from my code behind, I want to add <td> to it.
Please help.
Thanks,
Prachi
This is not possible without runat="server".
You say this was causing problems. Please say what problems it was causing.
You say you were accessing the table using getElementById? The ID of a server control changes based on what controls it's inside of. You need to get the changed ID to use:
var tab = getElementById("<%= myTable.ClientId %>");
or something to that effect.
You should use runat=server attribute if you want to access it at code behind.
But maybe you can generate some javascript code that adds the td/tr to your table at codebehind. and you can register it yo your page to run at startup.
runat="server"
to the table and the tr elements, there is no way the code behind can access them (as this tells the frame work to expose the elements to the server).
What are you actually trying to do? Have you looked at either DataGrid, GridView or simple Repeater control? These allow you to define a table structure and dynamically add controls to it (usually through data binding, although there are ways to add items to thier ItemCollections).
one way that you could do this is to add some inline scripting and a public string variable. in your code behind, make a public class-level variable:
public String myColumns
then in your Page_Load event, create your HTML as a string and save it in your myColumns variable:
protected void Page_Load() {
//do stuff
myColumns = someStringWithTDTagsInIt
}
Then in your .aspx page, do the following:
<table id=maintable"><tr><%=myColumns %></tr></table>
It should render your HTML as you wanted it to in your Page_Load event (or whatever event you want, if you want it to load on a button click or something) without using a "runat=server" tag.
Please note that this is not the recommended way to achieve this (controls are typically more efficient) but this should be a valid solution to the question you posed.
simple example.
just you place the runat="server" then you can access .
html controls are cannot access at server side. if you place runat server then it access in the server.

What's the difference in behavior between adding a control to an ASPX page directly, loading a control programmatically & adding to a placeholder?

Is there a difference in behavior between adding a control to the ASPX page directly and loading a control programmatically and adding to a placeholder?
The control inherits from System.Web.UI.WebControls.DataBoundControl.
The reason I ask is that I have a control that works when I add it to the ASPX page like so:
...
<blah:GoogleMap ID="GoogleMap1" runat="server" Width="640px" Height="600px" ... DataSourceID="_odsMarkers" DataAddressField="Address" DataTextField="Description">
</blah:GoogleMap>
...
But not when I use the following in a codebehind page:
GoogleMap map = (GoogleMap)this.LoadControl(typeof(GoogleMap), new object[] { });
//... set properties
this.placeholder1.Controls.Add(map); //add to placeholder
Anyone have any ideas why this might be the case?
The control tree ends up the same if you define in markup or add programmatically. However there is plenty of room for the control implementor to screw up along the way.
You can go look how ASP.NET compiles the aspx:
C:\Windows\Microsoft.NET\Framework\v2.0.50727\Temporary ASP.NET Files
The timing when the control is added to the page might be an issue. The usual pattern is add the control in an overload of the CreateChildControls method. If the control needs to resolve viewstate you need to make sure this is called during init, e.g. by calling EnsureChildControls.
Adding to ninja's debbugging hint. Does it make any difference if you add a label the same way. Does it show up?
Is this a user control or server control?
If it's a user control they should be loaded by their path and not their type:
GoogleMap map = (GoogleMap)this.LoadControl("~/Controls/GoogleMap.ascx");
If it's server control then you can just new up an instance:
GoogleMap map = new GoogleMap();
after you have the instance and add it to the control tree (by inserting it into the PlaceHolder) it should perform the same as when it would have been declared in the markup.
If you are setting properties outside of the LoadControl call, why are you making that new empty object array instead of just using the overload that has one parameter?
Also, if you attach a debugger to it and step through, do you notice anything weird about the control before you do your Controls.Add() call? Is there an exception being thrown? if so, which one? if not, what does the markup in the browser look like for where the placeholder is?
"Works" is kind of ambiguous, but if you mean, event handlers are never executed, you need to load it in the page onload event.
If the control requires the use of viewstate you must ensure that it is added to the page BEFORE the Page_Load event, otherwise viewstate will not be populated and most likely events and other items will not function properly.
One important difference is that if you create a control dynamically, you will not get, by default, any values from skins set. You must manually call control.ApplyStyleSheetSkin(page): http://msdn.microsoft.com/en-us/library/system.web.ui.control.applystylesheetskin.aspx

Are hidden fields on child window inaccessible from parent window

I have asp.net form that contains fields. When I access this window, my javascript functions can access the fields via the DOM with the getElementById() method and when I postpack to the server I am receiving the updates made by the client.
However, when I launch the form as a child window using Telerik's RadWindow control, the javascript can not access the hidden fields on the child form. Instead I get null.
My questions are:
Are hidden fields on a child window
not accessible when the window is
launched from a parent asp.net form?
Has anyone attempted this with Telerik controls and run into issues?
EDIT
Craig pointed out that the id may be different. Two additional questions then:
Can you ensure that the id you assign at the server is actually used?
Is using getElementByName() a better mechanism to access DOM elements?
To get the ID of your asp.net control do something like this:
<%= theControl.ClientID %>
getElementByName is not as commonly used as getElementById. The ID attribute is supposed to be unique for each element on the page whereas the name attribute can be duplicated.
It is quite possible that the element's ID is not what you think it is. Check the rendered page and see if the ID is there. I am guessing that the page is given a different ID since it is rendered inside another control.
If that is the case, you can have the form render some script that returns the element ID by accessing the controls client ID.
David, I'm sending you this answer because I saw the same issue in my code, and the only REAL solution I found was that I had to support the "OnClick" function in two places... In my case, I was using PetersDatePackage, but it was on a Telerik RAD Strip.
In my case, the control was on a .ascx page, and the JS code was as follows:
function OnIncidentDateChange(ctrl, dtDate, bErr)
{
var weekday = new Array(7);
weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Tuesday";
weekday[3] = "Wednesday";
weekday[4] = "Thursday";
weekday[5] = "Friday";
weekday[6] = "Saturday";
<%=LabelDayOfWeek.ClientID %>.innerText = weekday[dtDate.getDay()];
}
But, this itself was not enough. I had to add THIS code to my parent page. The page that holds the controls for the Telerik strip.
// Dummy function?
function OnIncidentDateChange()
{
}
Once I did that, it worked...
I'm not certain why, to tell you the truth, and it makes no sense to me, and may just be a issue with the PDP package...
I use getElementsByName for checkboxes within the same group.
As for the control's ID, TonyB has the right idea, but make sure you refer to the ClientID property in the PreRender event handler, because if you do it too early in the page life cycle, it will not be available yet).
Is it possible the that javascript is trying to get a reference to the hidden field before the RadWindow has loaded it? I believe I've run into this before and had to use setTimeout to get around the problem.

Resources