Friday, October 31, 2008

nPlus1.org: A New Resource For Architects

Twitter is great. It allows a whole new level of networking that can lead to some great discoveries. For example, I followed a conversation over to Chris Woodford's Twitter page. For those who don't know Chris, he's part of the popular Deep Fried Bytes podcast series. On Chris's page, he talked about nPlus1.org being open and looking for content authors. I've never heard of nPlus1.org and so I followed it.

Taken from the site's about section:

nPlus1.org is a site dedicated to helping Architects, aspiring Architects and Lead Developers learn, connect and contribute. On this site you’ll have access to great first party content written by some of the most skilled and experienced Architects working today. You’ll also have access to, and be able to contribute to a nexus of content from around the Internet aimed at keeping Architects up to date on all the new developments in their fields of interest.

This sounds very promising. Looking over the current posts, the site looks like a great resource for posting a collection of architecture related practices through community submissions. While the site has limited information at the time of this posting, I foresee it taking off in the very near future.

For more information, check out any of the following:
http://nPlus1.org
nPlus1.org on Twitter

Other Links:
Deep Fried Bytes
Chris Woodruff's blog

kick it on DotNetKicks.com

Saturday, October 25, 2008

Becoming More Than Just A Developer

A colleague of mine approached me the other day; wondering how he might be able to get out of the trend that he's found himself in.  The issue he approached me with was the fact that he's a tenured developer for his company and is often approached by his peers and managers to field questions and to help out when times are tough.  He has no issues with such; however, he finds himself drawn to newer technology than what he's working with on a daily basis and also loves helping people with their development questions.  In essence, he wants to become more than just the developer he is currently.  He wanted to know what he can do to expand his knowledge with new technology and project the information to others.

Like my friend, I had similar feelings in my job and career a while ago and looked at my options on how to branch out and grow outside of the mold that I found myself in.  Both of us wanted more than to come in to work, do our job, and then go home and do anything and everything.  In order to address my friends question, I decided to post some of the things that I would recommend based on my experience on going from a mind set of "just a developer" to acting on a desire to reach out and do more than code for a single company.

 

Finding Your Passion

So, you want to branch out and spread your wings.  Where do you start?  In order to answer this question, I have to ask: What are you passionate about?  The biggest advice that I can give to anyone looking to go beyond their daily developer routine is to know where your passions lie.  If you love designing applications, perhaps your passions surround UI designing or software architecture.  If your passion is a particular technology like Windows Workflow Foundation, perhaps focusing on such a technology, and similar ones, is your passion.  The reason why finding your passion is important is because you'll find yourself more motivated to follow through with various actions about such a topic.  Find your passion to find your subject matter.

 

Research Your Passion

Now that you have your passion identified, do a little research on it.  What are other people saying about your subject?  What resources are out there for you and others to learn about the subject?  If there are forums or a community around your subject matter, spend some time in there to see what everyone is saying about the subject.  While you're researching and tinkering with examples and such, don't be afraid to ask questions.  Everyone that learns something has questions about it at some time, and asking questions can yield to some good contacts and other opportunities (more on this later).

Something else to consider while researching your passion is to also look into attending local development user group sessions.  While the topics in question may not always be associated with your true passion, it does allow you to meet people, meet the organizers, and to somewhat get a feel for what others are looking for in such sessions.  Something else to keep a pulse on is the various development podcasts that exist.  These are invaluable since they can give you not only ideas but also lead you to new resources to expand your vision.

 

Finding a Starting Audience

Now that you have your subject matter that you are passionate about, who can you talk to about it?  There are many options with this.  You can, and probably already do, talk to your peers at work about this passion.  You probably talk about it more than you realize (I've been told that I do).  By talking to your peers you begin to generate a small buzz amongst your colleagues about what you're up to.  They may not know exactly what you're talking about all of the time; however, they know that it's important to you.

In addition to basic conversations with peers, you may find yourself in a position where a question that you asked is being asked again by a new community member or another person on a forum.  If you have the answer to the question, pipe up and share your knowledge.  Doing such will help others as well as help to build your confidence if you're concerned about giving the wrong information.  This also helps in showing others, including those that helped you, that you are learning the technology and enjoy it enough to help others with it.

 

Stepping Out of Your Comfort Zone

While everyone's comfort zone is different, taking a chance and changing things up a bit can be very beneficial to your desire of going beyond your typical routine.  One of the easiest ways to expand how your information and passion can be shared is to talk to your peers to see if they are open to the idea of spending their lunch hour learning about your subject.  Advise them to bring their lunch to the meeting and while everyone's eating, discuss your subject matter by providing some examples of such.  I'm not advocating "Death by Powerpoint" here since it's a sure-fire way to cause people anxiety about coming to your next one; however, having some key points to discuss and to show off the subject can help drive others to truly be interested in the topic.  From my own experience, I would recommend writing very little code on the fly and trying to keep the actual presentation to about 30-45 minutes to allow people time to get there and eat and to relax a bit since it IS their lunch hour.  If you keep doing these sessions (and you're presentation skills WILL get better if you listen to the feedback of your peers), you my find yourself presenting and helping out with different topics or even moving into "on the clock" training sessions that include more than just your immediate peers at the office. 

 

Personal Sites and Blogs

To go a step further, look towards getting a domain name and having a personal web site and/or blog.  If you want to start out small, there are a number of free blogging solutions out there (i.e. Blogger, Live Spaces, etc) where you can write about your experiences as you are learning about your passion more.  Make sure to publicize your blog and make it easy for people to subscribe to you.  The more you publicize the more people that you could possibly be helping.

 

Taking the Next Steps

At this point, the best thing I can suggest is to keep doing what has already been suggested.  Keep presenting to your peers and company, keep researching, keep answering questions, and keep getting involved.  After you feel confident in your skills with your passion, look towards possibly doing a presentation to your local developer's user group.  Seek out different user groups and events in other cities.  If you don't have a local group, look into possibly starting one.  Get involved in Twitter and other social web sites to connect to those that you have been following - you never know when they be begin looking in your direction.  As for the forums, if you are on there enough and build a good reputation, perhaps you may find yourself moving into a moderator position for that forum.  Eventually, your passions will lead to others as well and you'll be returning to researching and everything becomes cyclical. 

 

Conclusion

Nothing's wrong with being a developer and doing the typical coding, day in and day out.  However, if you are like my friend and myself, you may find your passion for coding transcends the code and you want to look into sharing your knowledge more.  If you're one of these individuals, I hope that some of these suggestions help you accomplish your goals and assist in voicing your passion.





kick it on DotNetKicks.com

Wednesday, October 15, 2008

Starting With jQuery - How to Write Custom Validation Rules

This series of posts on using jQuery with no prior knowledge comes to its fifth iteration. Today, I'm going to look more in depth at the Validation Plug-in.  We'll be looking at what rules the Validation Plug-in comes with out of the box followed by an example of how to create your own rules.   In addition to the typical project that I typically supply, I am also including a list of custom Validations that I have used to hopefully make everyone's life a little easier.
If you would like to review the previous posts in this series, please feel free to review the links below:

Required Downloads to use the Examples:

In order to use the Validation plug-in, you'll need to add a few things to your web page:

Code Downloads for this Post:

Source Code Download: Starting With jQuery - Custom Validation Rules.zip
Just the Rules File: Starting With jQuery - Additional Validation Rules.zip

A Look at some of the Built-In Validation Rules:

A wiser man than I once said that you should strive to never be your own plumber in software development.  Ultimately, you shouldn't spend time writing something that has already been written for you by someone else, is accessible, and meets your needs.  To go along with this concept I think it would be best to briefly cover what rules are already built into this excellent plug in.
  • Required: The typical and probably most used validation out there.
  • Minlength & Maxlength: Staple Length validation rules
  • Rangelength: Similar to Min/Maxlength; allows for selected item counts as well.
  • Min & Max & Range: Same as the "length" rules above only for numeric values.
  • Email: A very robust email validation rule
  • Url: Ensures the input is a well formatted url.
  • Date: Verifies the input can be parsed into a date.
  • Number: Ensures that the input is numeric.
  • Digits: Ensures only 0-9 characters (no commas, decimal points, etc.)
  • Credit Cards: Another complex and common validation rule made easy.
  • Accept: A file extension validation rule.
  • EqualTo: Ensures that the values of 2 elements are the same.
This is just a high level list of what's built in.  For additional information on all of the built in rules and how to use them, head over to the plug-in's documentation pages at http://docs.jquery.com/Plugins/Validation#List_of_built-in_Validation_methods.

Creating a Custom Validation Rule:

Now that we know what's already available, there may come a situation where we find that the built in rules just don't cover everything we need.  When such an occurrence comes upon us, we have the ability to extend the Validation Plug-in.  Custom validation rules are, ultimately, methods that are called and return a boolean value; true if the test succeeds and false if the test fails.  After the methods are created, they can be wired up to the jQuery validation component and used like any other rule.
To create a function that will encapsulate our validation test, we need to use one of the following signatures:
function myTest(value, element){...}
//OR
function mytest(value, element, params){...}
These function signatures, are identical except for the last parameter.  The value parameter houses the value that will be tested.  The element represents the element that is being tested.  The params involves any data that is being passed into the test (i.e. a minimum length value).
Looking over the list of built in validation rules, I noticed that one that was missing was a "Text Only" rule to ensure that only alpha characters would appear in the field.  Using this as an example, our validation rule function would look something like this:
function myTextOnlyValidation(value, element){
    return /[a-zA-Z ]/.test(value);
}

After we have the function established, we can then attach it to the jQuery Validation plug-in.  To do this, we call the validator object's addMethod() function.  This addMethod() function takes 3 parameters; a label for the rule, the function that contains the test, and the default message to display when the test fails. 
$.validator.addMethod("textOnly", myTextOnlyValidation, "Please enter only alpha characters( a-z ).");
Now that the function has been added, we can use the rule, called "textOnly", just like any of the built in rules.

Putting it all Together:

Now that we've looked at the built in rules, created our own rule, and wired up our custom rule; all that's left is to put everything together.  In this example, we're going to keep things simple and use just a single text box, a label, and a submit button (see Figure 1 below).
jQuery5 - Default Form Image
Figure 1 - the default form
For the example, we'll be applying 2 validation rules to this textbox.  The first will be the same required rule that we applied when we were first introduced to the Validation Plug-in.  The second rule will be our custom textOnly rule.  In order to do such, we need to add the following JavaScript to our code:
   1: //Our validation script will go here.
   2: $(document).ready(function(){
   3:  
   4:     //custom validation rule - text only
   5:     $.validator.addMethod("textOnly", 
   6:                           function(value, element) {
   7:                               return !/[0-9]*/.test(value);
   8:                           }, 
   9:                           "Alpha Characters Only."
  10:     );
  11:     
  12:     //validation implementation will go here.
  13:     $("#TestForm").validate({
  14:         rules: {
  15:             txtTextOnly: {
  16:                 required: true,
  17:                 textOnly: true
  18:             }
  19:         },
  20:         messages: {
  21:             txtTextOnly: {
  22:                 required: "* Required"
  23:             }
  24:         }    
  25:     });
  26: })
Note that in the example, the validation function is anonymous inside of the addMethod() function.
After the JavaScript has been applied to the form, we can verify that it works, as shown in Figure 2.
jQuery5 - Text Only Message
Figure 2 - Validating the Custom Rule

Some Additional Custom Rules:

I used the TextOnly rule in the example because it's a rather simple one to illustrate; however, any number of rules can be applied in the same way.  In order to provide additional content and to hopefully give others a jumpstart on implementing the jQuery Validation Plug-in onto their site, I have also added some additional custom rules.  These additional rules, available with in the example site or as a separate download, provide the following functionality:
  • Phone Numbers (in ###-###-#### format)
  • US Postal Codes ( ##### or #####-#### format)
  • Canadian Postal Codes
In addition, I highly encourage anyone interested in writing their own rules to play around and see what you can come up with.  With the power of jQuery, it's possible to pass 2 elements into test functions as parameters to verify something like a mathematical flash card scenario.  In addition, if you are looking for a good Regular Expression repository, I'd highly recommend http://www.regexlib.com for some additional patterns.



UPDATE 25 September 2012:

Since this is one of my most popular posts (THANK YOU!) I decided to address some comments about the example I wrote 4 years ago not working today.  

In terms of the advances of jQuery and the jQuery validation plugin, the code sample will still work properly; however, you'll need to upgrade both of them to the most recent versions (as of this update jQuery 1.8.2 and jQuery Validation 1.9).  Once this is done, the code sample will function continue to function as designed.

There is 1 small bug in the code sample though.  The textOnly rule found in ValidationRules.js and AdditionalRules.js has a bug with the regular expression.  Instead of an asterisk (*) in the regular expression pattern, it should be a plus-sign (+) to signify 1 or more instead of 0 or more.  Correcting this little bug will allow you to use the example rules without an issue.

Wednesday, October 8, 2008

jQuery, AJAX, and Classic ASP

While there was a good size buzz about jQuery before Scott Guthrie announced that jQuery will be shipping with Visual Studio, I have seen even more buzz with people wanting to learn more about it.  I have seen a huge number of new posts on ways to integrate it with traditional ASP.Net WebForm projects and tips and tricks with various extensions.  I have also noticed that Dreamweaver CS4 also has it bundled with it as well.  I'm not an Adobe guy so I have no idea if it was part of CS3 or not; however, I still find the momentum of jQuery amazing right now.

 

Even though I love learning and reading about the latest and greatest that the web design/development blogs have to offer, there are times in which we don't have the luxury of rebuilding our older/legacy applications.  Because of this, and a project I recently had, I explored the prospect of using jQuery to implement/replace AJAX functionality in a classic ASP application.

 

Background

This past week at work, I was given an unusual project that involved a legacy application that we rarely touch.  You know, one of those applications that has been around for ages and it works so no one wants to touch it if they really don't have to.  This particular application in my organization was a classic ASP application that had a page which was added on a couple years back that had the beginnings of AJAX.  The project was simple, ensure the site would be IE7 and FF3 compatible, because the current JavaScript would only work in IE6.  Sounds simple right?

 

Well, in all honesty, the project was pretty simple since I just had to use the appropriate XMLHTTPRequest object; however, once I put in the examples that are scattered across the Internet, it still didn't work.  So I had a choice between rewriting the entire JavaScript, the entire page in ASP.Net (my boss suggested/approved of such actions if required), or look into using jQuery instead of a homebrew of the XHR object.  I chose the latter.

 

The AJAX logic was rather simple.  The XHR object would send a request to a different classic ASP page which interpreted the query string and send back either a string value or actual HTML code through Response.Write().  There was no true, well formatted XML and it really was just simple request/response in a stateless manner.  Since this was the first time I'd ever looked at AJAX (or AJAH as some people would call this I'm finding out), I figured that I'd post it to help others with a speedy enhancement to their classic ASP instead of doing a full rebuild (which is costly).

 

Code

Download: jQuery and Classic ASP.zip

 

Overview

The code for this post focuses on a standard HTML page that sends XHR requests to a classic ASP application.  The way the classic ASP page is used in this example is similar to many web services where it exposes a number of functionality without publishing the WSDL file.  Our XHR will be passing a query string to this page that involves an ACTION parameter and then other values for that particular action.  Based on the ACTION, the ASP page will return a string value through the Response.Write() function.  In one instance, the ASP function will produce a string that is an HTML Select element, as well to illustrate what I'm finding out is called AJAH (Asynchronous JavaScript and HTML).

 

The ASP Code

This page has no UI.  On load, the page examines the query string for the ACTION parameter and based on the value, it will called the "Hello" function or the "GetList" function.

 

The HTML Form

The basic HTML Form is simple and divided into 2 parts.  The first is your typical "Hello, World!" example where the user enters their name and the jQuery makes a request to the classic ASP page for a returning string.  The second is a simple series of cascading drop down lists that are dynamically created on by the classic ASP page and sent back.  In both examples, I use jQuery's append() function to output the response to the screen.

The jQuery AJAX call is identical in both examples with the exception to the information being passed to the ASP page and the element the response is appended to.

   1: $.ajax({
   2:     type:"POST",
   3:     url: "http://localhost/jQueryExample.asp",
   4:     dataType: "application/x-www-form-urlencoded",
   5:     data: "Action=hello&Val=" + $("#txtName").val(),
   6:     async: false,
   7:     success: function(msg){ $("#fldHello").append(msg);}
   8: })

 

Conclusion

While I have to admit I hope I don't dive too much into classic ASP in the future, I do know that this experience has made my outlook on using it a bit better from a usability stance.  jQuery has made making AJAX style calls on classic ASP very simple to implement and allows for developers to not have to write their own plumbing code.

kick it on DotNetKicks.com