ASP.NET: How do I access my UserControl's property, from within JScript?
I need read access to a user defined property of the UserControl from within an element <script>
. This script should run when the user clicks on a link (which I also don't know how to set up). Thanks for your advice, SO!
Code for:
public partial class TNLink : System.Web.UI.UserControl
{
[System.ComponentModel.BindableAttribute(true)]
public virtual string TNImageURL { get; set; }
[System.ComponentModel.BindableAttribute(true)]
public virtual string FullImageURL { get; set; }
[System.ComponentModel.BindableAttribute(true)]
public virtual string Caption { get; set; }
}
ASP:
<script type="text/javascript">
//****How do I access the FullImageURL property for this line?****
document.getElementById('imgFull').src = FullImageURL;
</script>
<div style="text-align: center">
<a>
<asp:Image ID="imgTN" runat="server"
ImageUrl='<%# DataBinder.Eval (Page, "TNImageURL") %>'
style="border: 5px solid #000000; width: 85%;" /><br />
<asp:Label ID="lblCaption" runat="server"
Text='<%# DataBinder.Eval (Page, "Caption") %>' />
</a>
</div>
source to share
As Franci wrote , you need to write the property value to your html output when building the page on the server.
This is probably the easiest way to do it with your example:
<script type="text/javascript">
document.getElementById('imgFull').src = '<%= FullImageURL %>';
</script>
(The construction is <%= %>
just short for Response.Write
.)
source to share
The custom control runs on the server that hosts your web application. Js is executed in the browser of the client machine. There is no way for js to interact with your custom control.
However, your custom control is highlighting the html markup as part of its execution. This html is included in the dom page that the js has access to. This way you can emit the property value as part of that html (like declaring a js variable in a tag). The best place to do this would be in the .ascx file for user control.
source to share
When the page starts, view the html source (view source with right click). You will see that there are no tags there <asp>
. All converted to tags <html>
.
For example,
<asp:Panel>
is replaced with <div>
in html. And if you want to access the panel, you can only access the div with Javascript.
The same is true for other custom controls. Check out the html equivalent. And see what you can. Or provide us with html output.
source to share