Blog

Stop a PostBack using JavaScript and the OnClientClick event

If you need to be able to update the text displayed in an ASP.net control such as a LinkButton through code-behind before the page is rendered but will end up using that control to invoke client-side javascript and don’t want a PostBack to happen you can simply add “return false;” after your custom JavaScript calls in the OnClientClick event handler of the control. “return false;” actually stops the page from posting back to the server and allows your custom JavaScript to be run client-side.

Example:
<asp:LinkButton ID="lbtnVisit" runat="server" Text="ยป Default Text" OnClientClick="CustomScriptMethod(); return false;">

Full Page Processed on Partial PostBack

One odd thing you need to keep in mind when using AJAX.net and the AjaxControlToolkit is that when the UpdatePanel is used to do an asynchronous call back to the server the entire page state is sent back to the server and the entire page is reprocessed. This means that everything in your Page_Load and other initialization methods will be called again.

CSS Selector Specificity

To determine which CSS style in your style sheet will outrank the others you need to calculate the “Specificity” for each of the styles based on the selectors used to target the HTML element. To calculate use the following rules:

HTML Tag Selector: 1 point ( i.e. p, div, span )
CSS Class Selector: 10 points ( i.e. class=”redText” )
HTML ID Selector: 100 points ( i.e. id=”HeaderBox” )

Example Styles:

span { color:yellow; } => has a score of 1 = 1
#HeaderBox span {color:blue;} => has a score of 100+1 = 101
#HeaderBox .redText span { color:red; } => has a score of 100+10+1 = 111

Example HTML:

This text will be blue.

This text will be red.

This text will be yellow.

WCF Over HTTPS

If you need to communicate with a web service running over HTTPS and you are using WCF web service reference to accomplish this you need to add the following section to the Binding for the service endpoint in the Web.config.

Pseudo-Pseudo Classes

If you need a common chunk of text added before content you can use Pseudo selectors to accomplish this. An example is adding a chunk of text to the front of all blockquote elements in your HTML defining the quote as belonging to a specific category.

blockquote:before { content: "Classical"; }

Or you can use pseudo selectors to add check marks to the front of all links which have been visited by the user.

a:visited { padding: 20px; background: transparent url(/images/check.png) no-repeat top left;

Here are some others you might find useful:

a:before { content:"click here"; }
a:after { content:"click here"; }
p:first-letter { font-size:20px; }

These only work in newer more advanced browsers ( down with IE6 )

a[title] { color:red; } this is how you select a tag using one of its attributes as a qualifier. In other words this selector will only apply the color red to links that have a title.

a[title=special] { color:green; } this one applies the color green to all links which have a title and that title equals “special”.