I started building ContosoKarate (WebMatrix) by creating a site using the default WebMatrix Default Site Template.

The default template includes a collection of account related pages.

After modifying the _SiteLayout.cshtml the Register.cshtml looked pretty good.

So there are two things I need to do.

1. Enable Captcha
2. Make the formatting pretty.

First, I modified the Login Box markup to include a link to the Register.cshtml page.

<ul>
   <li><a href='#'>Forgot your password?</a></li>
   <li><a href='#'>Forgot your username?</a></li>
   <li><a href='@Href('~/Account/Register.cshtml')' /'>
          Create an account</a></li>
 </ul>

So I did a bit of clean up in the formatting and lined up form fields using a table. I know, I know – but for something this simple a table is perfect and easy.

Next, next enable Re-Captcha. To do this we’ll need to use the WebMatrix Package Manager (which is a front end to NuGet) to download and install some of the basic WebMatrix Razor Helpers.

Before we install he Re-Captcha Helper itself, we’ll need a Re-Captcha Key.

You can get one by going here https://www.google.com/recaptcha/admin/create and following the steps as in the screen shots below.

Save the ReCaptcha keys and start your WebMatrix application then add _Admin to the url in the browser.

ie: http://localhost:9999/_Admin

Read the rest of this entry »

1. David Strom – Recommended reading for nerds
2. Windows Phone 7 Student App Contest
3. A Smarter Way to Include JavaScripts and CSS to Reduce Page Load Times
4. jQuery Events: Stop (Mis)Using Return False
5. Enabling RSS Auto Discovery
6. RouteDebugger 2.0
7. State Management and ways to handle Cache in Web Farm or Web Garden scenario
8. 10 Highlights from 10 Years of Microsoft Business Applications
9. Programming For The Public Cloud?
10. JotForm.com
11. Can you measure the value of a Facebook Like?
12. FlashDevelop is a free and open source source code editor.
13. Is there a way to get WebPI to install Products in an offline way?
14. Demonstration of Shared Hosting Deployment with ARR
15. Oracle gives up on commercial Open Office
16. Google is Shutting Down Google Video
17. Obama moves forward with Internet ID plan
18. 7 dirty consultant tricks and how to avoid them.
19. Ultimate One iPod nano watch kit by Quad Mountain
20. Congressman blames U.S. unemployment crisis on iPad
21. 13 open source development projects making waves in the enterprise
22. 2011 IT Sallary Survey
23. Deploying an Orchard site using WebMatrix
24. Surfacing the Visual Basic Templates in WebMatrix
25. THE PASSION – 10 Most Outrageous Steve Ballmer Performances: A Video Round-Up
    Read the rest of this entry »

Dave Ward runs what, for me, is one of the most usefull developer blogs on the Web. http://encosia.com/

Though Dave does both front end and back end web development, his UI and jQuery blogging has been especially interesting to me so I though “why not talk to Dave out loud!’

Resources

• Dave’s Blog

Listen

Subscribe

MP3

WMA

M4A

Zune

iPod

Download

3GP

iPod

MP4

MP3

M4A

M4V

PSP

WMV

Zip

WMA

Zune

Monday I posted that I was starting a series of demo applications [ Read HERE ]

Please keep the suggestions and comments coming.

I’ve been asked about the theme for the site.

Since I have NO artistic ability myself ad I have no budget to hire a designer, I purchased Artisteer (with my own money !)

Artisteer is an interesting tool. Not perfect, but well worth the money for me.

For the “aesthetically challenged” like mem it offer complete theme suggestions and then you can have the tool suggest design changes on a section by section basis.

If you explore the tool you find that you can have a pretty detailed control over the look of your design.

I wanted a pretty standard “portal” style design to start with so I added a custom background and header graphic and settles on this.

Since I’m using a generated theme, in the future I’ll see how hard it will be to try to “plug” in theme variations.

Next, I needed to separate the UI “frame” into a template and the core for the default page into the Default.cshtml page

I’ve done this and formatted the markup. There is still lots to do with the Template but those details will take care of themselves as features get implemented.

The first bit of functionality we need to add is a customized site registration.

I doubt the state of the code would be useful to anyone at this point so I won’t bother to post it but if anyone wants it just email me and I’ll send it to you.

If you are new to WebMatrix of haven’t wrapped your head around PageTemplates yet you can find that and lots of other info [ HERE ]

I’ve been seeing a rise in inbound searches from Google and Bing of people looking for “Joe Stagner Videos”.

The ASP.NET web site team has been doing a lot of reorganizing on the www.asp.net web site and some of the older videos, while still there, are not as easy to find. (They need to make room for the “new” stuff.)

So I’ve started to index my ASP.NET, Microsoft Ajax, and Ajax Control Toolkit Videos here.

You can find them using the Video menu item at the top of my blog or the Videos menu to the right side.

I’ll try to add some every night until I’ve got them all.

Hopefully this will make them easier to find.

Today I began work on a new Sample Application called Contoso Karate

My proposed “design” is as follows:

The idea will be to create a production ready web site that represents your kids Karate School.

So, not a big production B2B or B2C Ecommerce site but still something with nice features, community and social functionality.

I intend to build the WebMatrix Version first and then perhaps an ASP.NET MVC 3 version. (Maybe even a MODERN WebForms version if there is interest.)

So, please take a moment to comment below on the features, methods, etc that you would like to see in a learning application with this context.

My goal is that folks will be able to use this to learn Web Site Development with Microsoft WebMatrix or modify the application to host any “club” based web site (Kids Soccer team, bowling league, etc.)

THANKS

This spring I wanted to run a contest for ASP.NET developers to drive contributions to Open Source projects.

I found a couple of xBox 360s, Kinects, and a bunch of software to give away to the winners.

Because there are lots of laws around how contests need to be run in order make sure everything is on the up-and-up, I contacted Microsoft’s legal department just to make sure I would be in compliance.

Ouch……

Now, I’d really like to inject a lawyer joke or two here or add a wisecrack about the attorney’s genetic proclivity to prevent anyone around then from getting any work done, but I’ve been trying to be more socially correct this year.

However, in the interest of protecting the company’s “six” I single person can not run a contest. In fact, what the lawyers told me I had to do was hire a third party to host and run the contest for me.

Duh !

So, I can’t have a contest, but I still want to rally .NET developers around some new Open Source contributions.

So, I thought I’d see if YOU ALL would agree to participate in an UN-CONTEST !

UNCONTEST – As in NOT a conference !

WIN NOTHING !

But maybe as a community we can do something cool.

HERE ARE THE RULES :

Wait…..  Since it’s not a contest, there are no rules.

But here is what I hope you will do…..

Write something open source !

A theme, module, plugin, etc. for any application that is (or will be after you write it) deployed with Microsoft WebMatrix, The Microsoft Web Platform Installer or Nugget.

Then EMAIL ME !

Once I get the first one I’ll create a page to post the new creations, I’ll blog and tweet about your work and get other folks at Microsoft to do the same.

You can even put a PayPal badge on your blog/site so anyone who really loves your work can decide to give you a dollar !

Readers of my blog will be able to decide which submissions they like best.

I’ll show them off all around Microsoft.

You’ll become a (more) famous developer.

So, pick an application like Orchard, BlogEngine.net, Umbraco, etc and create a theme or module or create a NuGet Package and email me the details.

I’ll blog and tweet about the submissions and I’ll do blog posts about my favorites.

Are you up to the challenge of a bit of Microsoft based Open Source ?

Please Tweet this & Blog it, pass it along. Lets see how many new “things” we can list by the end of June !

1. By default, ASP.NET WebForms is a SERVER side programming model and therefore all UI elements (ASP.NET Controls) with user interactions are assumed to have server-side logic.
2. We are integrating Client AND Server Development Models.
3. An ASPX (Web Forms) page is assumed to contain only ONE HTML form. (Though we can use advanced manual techniques to bypass this limitation)
4. Given the above items 1 & 3, all <asp:button> controls render as HTML Submit elements.

• <INPUT TYPE=BUTTON> // A button with a click event.
• <INPUT TYPE=SUBMIT> // A button whose click posts the html form
• <INPUT TYPE=RESET> // A button that causes form fields to be reset

• Ones that display something but have no need to SUBMIT The form
• Ones that take user input and MIGHT submit the form.

<%@ Page Title='Home Page' Language='C#' MasterPageFile='~/Site.master'
         AutoEventWireup='true' CodeFile='Default.aspx.cs' 
		 Inherits='_Default' %>

<asp:Content ID='HeaderContent' runat='server' 
             ContentPlaceHolderID='HeadContent'>
<link href='Styles/jqdialog.css' rel='stylesheet' type='text/css' />
</asp:Content>
<asp:Content ID='BodyContent' runat='server' 
             ContentPlaceHolderID='MainContent'>
<br />
<button ID='btnotify' type='button' class='CustomButton'>
        Notification Popup
</button><br /><br />
<button ID='btalert' type='button' class='CustomButton'>
        Alert Popup
</button><br /><br />
<button ID='btconfirm' type='button' class='CustomButton'>
        Confim Dialog
</button><br /><br />
<button ID='btprompt' type='button' class='CustomButton'>
        Input Prompt
</button><br /><br />
<button id='btcontent' type='button' class='CustomButton'>
        Any Custom Content
</button><br /><br />

<script src='http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.js'
        type='text/javascript'></script>
<script src='Scripts/jqdialog.min.js' type='text/javascript'></script>
<script src='Scripts/jQueryDialogs.js' type='text/javascript'></script>
</asp:Content>

<%@ Page Title='Home Page' Language='C#' MasterPageFile='~/Site.master'
         AutoEventWireup='true' CodeFile='Default.aspx.cs' 
		 Inherits='_Default' %>

<asp:Content ID='HeaderContent' runat='server' 
             ContentPlaceHolderID='HeadContent'>
    <link href='Styles/Selectbox.css' rel='stylesheet' type='text/css' />
	<script src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js'
            type='text/javascript' charset='utf-8'></script>
	<script type='text/javascript' src='Scripts/jquery.selectbox-0.5.js'>
	</script>
    <script src='Scripts/PageScript.js' type='text/javascript'></script>
</asp:Content>
<asp:Content ID='BodyContent' runat='server' 
             ContentPlaceHolderID='MainContent'>
    <h2>
        Welcome to ASP.NET!
    </h2>
    <p>
        To learn more about ASP.NET visit
        <a href='http://www.asp.net' title='ASP.NET Website'>www.asp.net</a>.
    </p>

    <p>
    <asp:DropDownList runat='server' name='Items' id='Items'
                      class='StyledDD' ClientIDMode='Static'>
      <asp:ListItem>One</asp:ListItem>
      <asp:ListItem>Two</asp:ListItem>
      <asp:ListItem>Three</asp:ListItem>
      <asp:ListItem>Four</asp:ListItem>
    </asp:DropDownList>
    </p>
</asp:Content>

Read the rest of this entry »

The ASP.NET Ajax Control Toolkit includes an “Autocomplete Extender“.

In this series I’ve been demonstrating ways to implement the features of the MS Ajax Toolkit with jQuery.

jQuery UI makes “AutoComplete” very straight forward (Read the plugin spec here.)

Here is the behavior.

After the user enters 2 or more characters, then the UI starts to suggest values for the textbox.

In the case fo the jQuery UI Autocomplete plugin, the data can come from inside the page’s Document Object Model (DOM) or from a JavaScript callable web service.

For small data sets you may want to just send all the possible values to the browser with the rest of the page but AutoSuggest fields are most helpful when the number of possible value choices are too numerous to fit in a page’s dropdown control.

In this case, supplying the values via a service method is your choice and that’s what we’ll do in our example.

After creating a new website using the default ASP.NET Web Site Template, I’ll include a jQuery UI template CSS file and 3 JavaScript files.

• jQuery
• jQuery UI
• a custom JavaScript file that contains my page specific code.

Then I’ll add an ASP.NET TextBox filed and associated label for the user to enter an email address in.

The markup for my default.aspx page is as follows:

<%@ Page Title='Home Page' Language='C#' MasterPageFile='~/Site.master'
         AutoEventWireup='true' CodeFile='Default.aspx.cs' 
		                        Inherits='_Default' %>

<asp:Content ID='HeaderContent' runat='server' 
             ContentPlaceHolderID='HeadContent'>
<link href='http://ajax.aspnetcdn.com/ajax/jquery.ui/
                   1.8.10/themes/redmond/jquery-ui.css'
      rel='stylesheet' type='text/css'/>

</asp:Content>
<asp:Content ID='BodyContent' runat='server' 
                              ContentPlaceHolderID='MainContent'>
    <h2>
        Welcome to ASP.NET!
    </h2>
    <p>
        To learn more about ASP.NET visit
        <a href='http://www.asp.net' title='ASP.NET Website'>www.asp.net</a>.
    </p>
    <hr /><br />

    <div>
            <label for='tbAuto'>Enter Email: </label>
             <asp:TextBox ID='tbAuto' class='autosuggest' runat='server'>
             </asp:TextBox>
    </div>
    <script type='text/javascript'
            src='http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.js'>
    </script>
    <script type='text/javascript'
     src='http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/jquery-ui.js'>
    </script>
    <script src='Scripts/PageScript.js' type='text/javascript'></script>
</asp:Content>

Next we need a service that will take a few characters of string as in input argument and return a collection of emaill addresses that match the beginning characters that the user entered.

SO, I’ll add an .ASMX service called EmployeeList.asmx

The service codebehind looks like this:

using System.Collections.Generic;
using System.Linq;
using System.Web.Services;
using System.Web.Script.Services;

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class EmployeeList : System.Web.Services.WebService
{
  [WebMethod]
    public List GetEmailSuggestions(string mail)
    {
    var emp = new Employee();
    var suggestionList = emp.GetEmployeeList()
    .Where(m => m.Email.ToLower().StartsWith(mail.ToLower()));
        return suggestionList.ToList();
    }
}

If you are new to service programming in ASP.NET you will note the [WebMethod] attribute on the GetMailSuggestions method will cause the method to be exposed via HTTP and the class itself is decorated with the [ScriptService] attribute which will make the class callable my JavaScript and provide facilities like JavaScript proxy generation.
Read the rest of this entry »