XMod Pro 4 is packed with new features. Among them is a brand new ability to leverage the customizable, highly flexible forms of XMod Pro to create a custom login form for your DNN website.

If you're crafting that unique, one-of-a-kind site for yourself or your client (one of the reasons for using XMod Pro in the first place), you don't want the site's visitors to be presented with a clunky plain-vanilla login screen. Beginning in version 4, you can turn your forms into login forms with a simple tag.

Here's a look at a basic XMod Pro form designed as a login form:

<AddForm>

	<Label For="Uname" Text="Username:" />
		<TextBox Id="Uname" DataField="Uname" DataType="string" />
	
	<Label For="Pword" Text="Password:" />
		<Password Id="Pword" DataField="Pword" DataType="string" />

	<AddButton Text="Login" />

	<CancelButton Text="Cancel" />
		
	<Login Username='[[Uname]]' Password='[[Pword]]' />

</AddForm>

The <Login> tag is in red above. As you can see, it's quite simple. It has two required properties: Username and Password. You could hard-code these, but in most cases you'll want to use Field Tokens to grab information from the Username and Password controls on the form.

The Username control has its DataField set to "Uname" so we use the [[Uname]] Field Token as the value for the Login's Username property. Likewise, the Password's DataField is set to "Pword" so we use [[Pword]] as the value for the Password property on the Login tag. Typically, you'll want to use XMod Pro's <Password> control for user entry of passwords as it masks the user input.

Finally, the <AddButton> has its Text set to "Login". We're using the <AddButton> even though we're not saving any data to the database. The <AddForm> tags can be used as plain forms that don't have to be tied to a database.

Redirecting the User After Login

Once you press the "Login" button, you're logged-in - presuming you've provided the correct username and password. You may not see any change on the page. When you navigate to another page you'll see that you are, indeed, logged in.

That's not terribly user friendly so let's send the user somewhere after logging in:

<AddForm>

	<Label For="Uname" Text="Username:" />
		<TextBox Id="Uname" DataField="Uname" DataType="string" />
		
	<Label For="Pword" Text="Password:" />
		<Password Id="Pword" DataField="Pword" DataType="string" />

	<AddButton Text="Login" />
	
	<CancelButton Text="Cancel" />

	<Login Username='[[Uname]]' Password='[[Pword]]' />
	
	<Redirect Target='~/Home.aspx' />
	
</AddForm>

We could have simply added a Redirect property to the <AddButton> tag, but for this I thought I'd call on another new feature in XMod Pro 4 - the <Redirect> tag. I'll cover this more in a later blog post, but the <Redirect> tag gives us more flexibility than the Redirect property.

As it stands now, the user will be sent to the Home page (presuming it's located at Home.aspx) after a successful login. If we want to send them to a page that is specific to their UserID (which is only available after successfully logging in) then we can use:

<AddForm>

	<Label For="Uname" Text="Username:" />
		<TextBox Id="Uname" DataField="Uname" DataType="string" />

	<Label For="Pword" Text="Password:" />
		<Password Id="Pword" DataField="Pword" DataType="string" />

	<AddButton Text="Login" />
		
	<CancelButton Text="Cancel" />
		
	<Login Username='[[Uname]]' Password='[[Pword]]'UserIdField="uid" />

	<Redirect Target='~/Home.aspx?userid=[[uid]]' />

</AddForm>

In this example we used one of the optional field name tags. The <Login> tag gives you the opportunity to pull information from the just-logged-in user that you didn't have before such as the user's ID, first name, last name, and username. This information can then be passed "downstream" (i.e. to action tags that follow the <Login> tag) for use.

So, we've instructed the <Login> tag to grab the User's ID and give it a field name of "uid". Then, in the <Redirect> tag we can use that value simply by using the field token [[uid]].

Not only does the <Login> tag make it easy for you to craft a custom login page for your visitors, it also opens up a wide array of possibilities for dynamically responding to the user who just logged-in. But, this is just the tip of the iceberg. There's more dynamic goodness where that came from. Stay tuned.