Let’s say the function looks something like this.

<script type="text/javascript">function HandleClick() {
alert("Some message!");
}
</script>

Now let’s test it.

Click this link.

See what happened? The javascript function was executed but you still got redirected to the url set in the href attribute of the link.

This is due to the fact that we have overridden the default behaviour of the hyperlink but we still haven’t told Javascript to cancel the default behaviour.

How do we fix this? Just add return false; right after the function call, as shown below.

<a href="http://www.morethan2cents.com" onclick="HandleClick(); return false;">link</a>

By returning false, you are basically telling javascript that the link was not clicked and thus not to trigger the default behaviour.

Now try it again. Click this link.

Voila! No redirection. Alternatively, you could leave the href attribute blank (href=””). But that would basically refresh the page for obvious reasons.

Anyways…the challenge was that there were atleast 25 or more products displayed in the grid and thus as you can imagine, when the user checked the bottom most product’s override checkbox the page posted back and auto-scrolled to the top of the page. This could be very annoying to the user and apparently, Smart Navigation was neither smart nor navigated anywhere expected and forced me to rely on Javascript to solve this issue.

After some googling, here’s how i fixed it.

There’s a javascript property called location.hash

bq. hash is a property of both the Link and the Location objects and is a string beginning with a hash (#). It specifies an anchor name in an HTTP URL.

For example, if the url is something like http://www.example.com#anchor

then #anchor is the hash property.

What this means is that if you have the id of an element in the page, you can set the focus to that element, when the page loads by using the location.hash property.

If you are using the a element , then you may use either the id attribute or the name attribute.

So i wrote a little procedure in the aspx’s code-behind that looks like this:

Private Sub anchorScript(ByVal productId As String)
     Dim Script As String
     Script &= "" & Environment.NewLine
     Script &= "var anchorLocation='#" & productId & "';" & Environment.NewLine
     Script &= "location.hash=anchorLocation;" & Environment.NewLine
     Script &= "" & Environment.NewLine

     If (Not Page.IsStartupScriptRegistered("anchorScript")) Then
           Page.RegisterStartupScript("anchorScript", Script)
     End If
End Sub

And called this procedure after doing the necessary stuff in the checkbox’s CheckedChanged event handler. Typically this would be the last line in the sub.

The above procedure registers a javascript function that when rendered, would look like this :

var anchorLocation='#'
location.hash=anchorLocation;

This would tell the browser to focus on the element that has an id(passed into the anchorScript procedure).

Simple. Worked like a charm.