Archive for November, 2008

JQuery Toggle Visibility Of A Div

November 26, 2008

“The longest journey begins with but a single step” – Probably Not Confucius

This was my first ever JQuery script and, though it be just one line long, I still learned something from it.

script
function setProgressBarVisible()
{
$('[id$=progressBar]').css('visibility', 'visible');
}
/script


This is the div that I wanted to hide/unhide:

div id="progressBar" style="position: fixed; left: 0; top: 0; background: orange;
visibility:hidden; padding: 10px; font-size: small;"
Update In Progress...
/div


Here’s the Link Button that calls the JQuery:

asp:LinkButton ID="reIssueLinkButton" runat="server"
Text='Reissue' OnClientClick="setProgressBarVisible();"
OnClick="reissueLinkButton_Click" /

All that code above works. If you copy and paste it into a JQuery-enabled project, an Orange rectangle will appear in the top-left corner of the browser when you click reissueLinkButton and automatically go away when the page reloads after the postback.

What I learnt along the way was that you have to use visibility=”hidden” in the Style attribute and not Visible=false in the Visible attribute.

Visible=false will not be toggled by the JQuery script because Visible can only be set if you make the div an ASP.NET Server control i.e. runat=”server”. If you do that then the ID property of the div will not be ‘progressbar’ but an ASP variable based on its container e.g ctl00_progressbar, so the setProgressBarVisible function cannot work.

So there you go. A single step. FWIW.

Here’s the page I Googled to get started.

For Advanced Students
The immortal DDK has a great post on Using jQuery to toggle visibility of an ASP.NET textbox based on an ASP.NET DropDownList Control

When Are Custom Event Handlers Attached ?

November 18, 2008

I have a UserControl inside a GridView.
When are the Custom Event Handlers attached to the UserControl ?
Please tell me because I have no idea.

In the scenario below the UserCreated event handler is null at the time the UserCreated event is fired, i.e. during DataBinding. Once the page has fully loaded the event handlers are available.

UserControl

public event EventHandler UserCreated;
public event EventHandler UserSelected;

///
/// Bubble up the UserCreated event
///
protected virtual void OnUserCreated(object sender, UserCreatedArgs e)
{
EventHandler handler = UserCreated;
/*
UserCreated above is null during databinding. No handler is present
A handler is present after page has fully loaded i.e. UserCreated != null
*/

if (handler != null)
{
handler(this, e);
}
}

///
/// Raise the OnDataBindingEvent
///
protected override void OnDataBinding(EventArgs e)
{
base.OnDataBinding(e);
InitialiseControl();
}

///
/// Initialises the data in the UserControl.
///
private void InitialiseControl()
{
List userList =
UserController.GenerateUserNameDropDownList(UserGroupName);
OnUserCreated(userList);
}

Page On Which UserControl is Hosted

///
/// Handles the Load event of the Page control.
///
protected void Page_Load(object sender, EventArgs e)
{
UserCreatedHandler += UserControl.UserCreated
}

protected void UserCreatedHandler(object sender, UserControl.UserCreatedArgs e)
{
...handle userCreated event
}

Markup For The Page

asp:GridView ID="keyPersonnelGridView" runat="server"
Columns
asp:TemplateField
ItemTemplate
userControl:UserName ID="personnelList" runat="server" UserGroupName="All Users"
/ItemTemplate
/asp:TemplateField
..rest of tags closed
/asp:GridView

Can any kind soul please explain why my Event handlers are not present when the event is fired ?

Muchos Gracias Tadpolaramus

Ajax Client Side Event Cycle

November 11, 2008

Our team lead recently passed around a brilliant diagram compiled by Milan Negovan of AspNetResources which explains the ASP.NET Ajax Client Side Event Cycle.

I’m linking to it here so I can reference it in the future and hopefully give it a bit extra publicity which it well deserves. Have a look.

Milan shows how the page events, Application events and PageRequestManager events interract during AJAX calls and clearly explains how to hook into those events i.e. add your own handlers. It also explains exactly where UpdatePanel fits into the picture and clearly states when and who calls what event.

To whet your appetite…

When partial-page rendering with UpdatePanel controls is enabled, the key client
events are the events of the PageRequestManager class. These events enable you to
handle many common scenarios. These include the ability to cancel postbacks, to give
precedence to one postback over another, and to animate UpdatePanel controls when
their content is refreshed.

To add or remove handlers for events raised by the Application and
PageRequestManager classes, use the add_eventname and remove_eventname methods
of those classes…

Top work Milan!

Regex For Alphanumeric Plus Punctuation

November 6, 2008

My knowledge of Regular Expressions is marginally below that of a lobotomised axolotl, but I know that Regexes are powerful and good, sort of like King Arthur of the Britons prior to the Lancelot betrayal or a Bex, though perhaps not quite as addictive. So today I made one.

Project Numbers in our Universe here at anonymous megacorp international are no more than 12 characters long, are alphanumeric but may also contain hyphen, fullstop and colon. It took me a few Googles to hit on a good introductory Regex web-page, that helped me solve the problem, so maybe while this issue didn’t quite match my full criteria for a Journey In Pain, it did go close. So here it is:

Regex projectNumberRegex = new Regex("^[-a-zA-Z0-9:.]{1,12}$");
if (!projectNumberRegex.IsMatch(dto.ProjectNumber))
{
...run away screaming
}

Here’s Why It Works

a-zA-z0-9 are the alphanumerics
:. are colon and full-stop (not the Braille symbol for ‘No Smoking’)

– (hyphen) is placed at the start of the string because if I place it between ‘9’ and ‘:’, say, the Regex Parser will interperet as a range, which can cause it to fail if ASCII(9) is greater than ASCII(-), or sneakily introduce a FALSE SUCCESSFUL range condition where none is intended.

Hyphens cannot be escaped by backslash, hence must appear either first or last in your Regex to avoid being interpereted as a range comparison. I put it at the front of the allowable characters based on the advice on this page.

[] is for grouping. It means “any of”.

^ (caret) is the ‘start of line’ character. I’m telling the Regex parser that the first character in the input string must be whatever follows the caret, which is anything in the [] grouping.

$ means “end of pattern”. This means that ONLY the sequence prior to the $ are legal. If there are additional characters in the input then the Regex fails. This is what I want. I don’t want ProjectNumber to contain anything else except the stuff in the [] group.

{1,12}means the grouping must appear between one and 12 times. That means empty string will not succeed, neither will a string of 13 or more chars.

Glorious.

In your GILLS, Ambystoma Mexicanum