I have a sublayout in sitecore (which is an ascx control) which contains a hidden field and an image map. Depending on the area of the image map which is clicked, I want to set the value of the hidden field, then initiate a postback to the server.
My markup is as follows:
<script type="text/javascript">
function SetRegion(regionName) {
$('#<%=hdnRegion.ClientID%>').val(regionName);
__doPostBack('<%=lnkRedirectButton.UniqueID%>', '');
}
</script>
<img src="/Images/Interface/Map-Background.png" usemap="#regionMapView" class="map" />
<map id="regionMapView" name="regionMapView">
<area id="x" href="javascript:SetRegion('x')" shape="poly" coords=",,,," />
<area id="y" href="javascript:SetRegion('y')" shape="poly" coords=",,,," />
<area id="z" href="javascript:SetRegion('z')" shape="poly" coords=",,,," />
</map>
<asp:HiddenField ID="hdnRegion" runat="server" />
<asp:LinkButton ID="lnkRedirectButton" onclick="lnkRedirectButton_Click" runat="server" />
and my code-behind is as follows:
protected void lnkRedirectButton_Click(object sender, EventArgs e)
{
string region = hdnRegion.Value; //at this point, I expect hdnRegion.Value to be "x" "y" or "z" but it's always coming back empty :-(
//do stuff...
}
I added the dummy LinkButton to use as a hook for the postback (to create a code-behind method to handle the postback).
I've tried this code in a stand-alone webapplication and it seems to work fine, so I'm wondering if there is something going on with sitecore which is messing up the hidden field's value during the postback process?
To clarify; the postback event is being fired and handled on the server ok and I've used alert() in javascript to confirm that the hidden field value was being set correctly.
Edit: Retagged question to include jquery-ui tag. This issue seems to be related to the fact that all of this is happening inside of a div which is displayed using $().dialog() method in the jQuery UI library...