Expanding ClientID in an event string

Question

I'm having a problem with <%= obj.ClientID %> expansion, in a .ascx user control.

I have a .js file, containing a javascript function:

function doSomething(objectId)
{
    ...
}

I have a .ascx file, with some html elements, and in one element's onclick= I want to call doSomething(), passing the ID of an element in that .ascx file, where the passed ID is of an element other than the one being clicked on, so I can't use "this.".

Maybe it'd be clearer with an example.

This works:

<script type="text/javascript">
    function redirect()
    {
        doSomething('<%= top.ClientID %>');
    }
</script>
<div id="top" runat="server">
    <img src="..." alt="..." onclick="redirect();"/>
</div>

But this does not:

<div id="top" runat="server">
    <img src="..." alt="..." onclick="doSomething('<%= top.ClientID %>');"/>
</div>

When I look at the source, I see that the <%= %> substitution has not happened, instead of "doSomething('ctl00_myControl_top');" I get "doSomething('<%= top.ClientID %>');"

For some reason, the script expansion happens in the former case, but not in the latter. The work-around, of course, is not acceptable because it will break if I include multiple copies of the control on a page - only one instance's "redirect()" function will be accessible.

Any ideas on how to make this substitution work?

Answer 1

Works on my machine?

<div id="top" runat="server">
    <a href="#" onclick="doSomething('<%= top.ClientID %>')">rarrarara</a>
</div>

Becomes

<div id="ctl00_ContentPlaceHolder1_top">
    <a href="#" onclick="doSomething('ctl00_ContentPlaceHolder1_top')">rarrarara</a>
</div>