![]() |
Development Lifecycle »
Design and Architecture »
General
Intermediate
Rapid Web Application DevelopmentBy Andrew M BaldwinAn article about the Multiformity Open Source project. |
C#, SQL, Windows, .NET 1.0, ASP.NET, SQL 2000, IIS 5.1, IIS 6, DBA, Dev
|
|
Advanced Search |
|
|
|
||||||||||||||||
The Multiformity engine consists of controls that are easy to configure, and accommodates many of the common needs for a web application that connects to a database. It automatically provides the abilities to add, edit and read data, as well as includes integrated help, treeview and scheduling controls and many other functionalities.
Note: The code has been converted and upgraded to ASP.NET 2.0 :D.
The purpose of this toolset is to allow for your development team to focus on the "rocket science" behind a specific project, rather than the mundane, day to day details of the given application. Below are a few screenshots of the inherent functionality of this system:



The Multiformity engine currently supports (Note: this is not a complete list, that would be too long for this article ;):
MultiListbox control for long multi select listboxes, also allows ordering of the data.
UserInformation object stores all of the data associated with a user, and is accessible through any page that inherits BasePage.cs automatically.
One of the features that makes the Multiformity engine better than your average grid control or databound text box is that they are all inter-related. For example the Grid control displays links that go to pages that display the other controls like the record viewer or form. The grid control also uses a form object to implement its own filter functionality; the treeview uses a record viewer to display row contents. Additionally, these larger controls also use the smaller and simpler "form" controls that also refer to the larger controls. Read on for a partial list of controls currently available:
| Control | Description |
|---|---|
ProcessViewer |
Displays the current step for a process, as well as a way to return to any previous step. This control is used as part of the process automation framework, which gives the developer the ability to quickly string many of these components and other custom components together to complete a task using systematic steps. |
TreeView |
A TreeView control displays tables from the database where the tables have a one to many relationship, allowing a treeview concept. For example, the integrated help system utilizes a treeview control to display the help topics on the left hand side, with the topic content displayed on the right. This could also be used to display items in an inventory grouped by manufacturer, or color, or many other factors. |
Form |
Used to add or edit data to the database. It contains all of the add/update, cancel and delete buttons for the appropriate situation. |
Grid |
The Grid object needs to do nothing else except display the user that will be accessing the data, and the table that the user wishes to see. It automatically filters, sorts and pages, all the while maintaining state. Contains links to all the appropriate edit/add forms and to some other useful links. |
PropertiesEditor |
Edits a text file with the extension of .properties and contains name value pairs separated by equal signs. This toolset was designed with the purpose of not needing to update code and compile in order to make many minor and some major types of customizations. Editing various properties on the server through the web site makes it easy to accomplish a lot of these goals. |
RecordViewer |
Views a record of data, expanding any large text field to be read in full on the page. |
Button |
A Button is actually a placeholder, either with a button, link or an image on it, and it can either have simply a link to redirect to, or an event handler assigned to its click. |
Calendar |
Contains three controls. The default Calendar control, a button and a textbox. The button will hide and/or show the calendar control, and clicking a date in the calendar will place the selected date into the textbox. |
CheckBox |
Implements a "True/False/Default" implementation of a checkbox using JavaScript and images. |
DropDown |
Contains a dropdown and a button. Clicking the button will open the default grid displaying the linked table. |
MultiSelect |
Contains two multiselect dropdown lists with move one or all buttons to move the source list to the selected target lists. This control is databound, and saves and reads the result into the database as a comma separated list. |
TextBox |
Provides a basic databound Textbox |
In addition to these features, Multiformity is a breeze to use and setup. We only suggest that you read the readme and other documentation before trying to utilize these tools with your existing databases, as we have a naming convention that we use that allows for the "defaults" to kick in. You do not have to use our naming conventions, but it will require a bit more setup otherwise.
Utilizing the code is rather easy, and entails many of the specifics that any developer will have to account for in their custom projects. Things like absolute paths to system directories, DSN strings, and other similar things do need to be configured, which I will detail in the following sections.
For a full information on how to use the code, you can read the documentation included in the source zip file (multiformity.chm). For a brief rundown on the basics:
using System.Web.UI.WebControls;
using rasp.Components.HTML.PageControls;
//Note that the page must implement the BasePage class.
public class Display : rasp.Components.BasePage {
...
//Find the placeholder or any other control
//that you wish to put the grid on:
PlaceHolder ph = (PlaceHolder)FindControl("Grid");
//Create the grid object, giving the constructor
//a reference to the page that the
//control will be displayed on, and a
//UserInformation object that is maintained
//by a basepage object that the page
//inherits from. Any required information is
//automatically retrieved off of the querystring
//object by the grid itself, although
//the grid object can take a parameterized list
//in the constructor to specify the table
//in the database that that you wish the grid
//to bind to and other information.
Grid wc = new Grid(this, this.UserInformation);
//Add the control and you are done!
ph.Controls.Add(wc.TheGrid);
You will probably notice that there are really only six lines of code here, the rest is just commenting...
using System.Web.UI.WebControls;
using rasp.Components.HTML.PageControls;
//Note that the page must implement the BasePage class
public class Edit : rasp.Components.BasePage {
...
//Get the control to hold the form.
PlaceHolder EditForm = (PlaceHolder)FindControl("EditForm");
//Get a form object, providing the page
//that will contain the form, and
//the userinformation maintained by
//the basepage. Again the details of
//the form are accessed from the pages
//querystring, but you can provide
//a prameterized list to the constructor
//to give it a table which you will
//be adding a row to or adding to
//it a possible row ID to edit a row instead
//of add.
Form f = new Form(this, this.UserInformation);
//The form does not actually sort and
//generate the HTML until you tell it
//that you are ready for the current
//implementation of the form object.
//This is done so that you can dynamically
//change things on the form before
//it is generated.
EditForm.Controls.Add(f.RecordEditor);
Most of the other controls are similar to this, but I won't bore you with those details, but it is important to note again that there are just six lines of code to display an edit form.
Now, let's see how you do some really cool stuff. The form control that I have created automatically generates databound controls, it additionally will automatically sort the controls and place them on the tabs for you, but there may be a situation where you need to display a "custom" edit or add form for a particular table (if not all of them). This is the classic "separating form from control" situation, you have web designers that design the look and feel of a page, but don't know much about how to create a databound control programmatically. For this I have provided another class that inherits from the BasePage class that automatically finds a place to put the controls for the form. With this architecture, the web designer can simply put in <asp:placeholder> tags that designate the control to be obtained from the DB. I will be improving on this concept later, but for now, here is how it works:
The ASPX Page:
<%@ Page language="c#" Codebehind="EditRow.aspx.cs"
AutoEventWireup="false" Inherits="EditRow.cs" %>
<HTML>
<HEAD>
<title>EditField</title>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="EditField" method="post" runat="server">
<table>
<tr><td>
<asp:PlaceHolder ID=Form_Name Runat="server" />
</td><td>
<asp:PlaceHolder ID=Form_Caption Runat="server" />
</td></tr>
<tr><td>
<asp:PlaceHolder ID="Form_Submit_Button" Runat="server" />
</td></tr>
</table>
</form>
</body>
</HTML>
Note here that the IDs of the placeholders are the field names preceded by "Form_", it's that simple!
The code-behind file:
...
//Note that this inherits the FormPage class that inherits from BasePage.
public class EditRow : FormPage {
...
private void Page_Load(object sender, System.EventArgs e) {
//Set the name of the table that will be edited or added to
this._Adapter = "TableName";
//Put the controls on the page.
this.PopulateControls(this);
}
...
The base class in question (FormPage.cs) is a little specific to explain here, but I will simply state that it has the protected _Adapter string member, and with that figures out where to place the desired controls designated by the IDs of the placeholders in the ASPX file.
This way, edit pages can be created by web designers rather than web developers.
Files included in download:
Note: There is also a folder in this Zip file called RaspDocs that has a lot more detailed information about how the system works; although they are still works in progress, they will shed light on how the plumbing and other features are organized.
Dynamic creation of databound HTML controls is a topic that is not covered by many, if any books or online references. I have, however learned much about the topic, and plan on writing about my findings at a later date when I get some time, so keep an eye out for those articles! Email me at Multiformity@austin.rr.com for a current status of where I am with my articles, as I plan on writing many in the near future!
This is the second release of the Multiformity engine, further development depends on the community, so please donate and it will come back to you tenfold!
Icons for the Multiformity engine were graciously donated by the folks at Ace Icons, a division of Can Do Software. They are the one stop for all of your icon and graphic needs. Please support our partner and purchase a set of icons to keep the look and feel of Multiformity consistent in your projects.
Multiformity is an open source project. We welcome any feedback and new code that the community would wish to share, but it is not required. This toolset is released under the GNU public license, which means that you can utilize it in any public or private project. We do however appreciate any improvements that can be incorporated back into the source ... Share the love ;). Again though, since the icons were donated, please be mindful of that, and utilize Ace Icons for any graphic needs that you may have. The reason that I have released this project as open source is because it is now too much for me to handle at once.
General
News
Question
Answer
Joke
Rant
Admin
|
PermaLink |
Privacy |
Terms of Use
Last Updated: 27 Sep 2005 Editor: Smitha Vijayan |
Copyright 2005 by Andrew M Baldwin Everything else Copyright © CodeProject, 1999-2009 Web15 | Advertise on the Code Project |