Using Silverlight in Enterprise: RAD of User Friendly Database Access

• Download full source code - 5.08 MB
• Download sample database backup file - 3.67 KB

Introduction

In this article, you will find an interesting approach to build Silverlight Web UI for database access quickly and easily. For more than 7 years, FulcrumWeb Company is evolving internal RAD Framework together with development and support of enterprise business solutions for Manufacture, Financial, Law, Healthcare, and Government industries. Recently we decided to make Silverlight version of our framework available to you for free with FULL SOURCE CODE. Probably the best way to get a small taste of what can be done with our Framework is to see the live demo located on FulcrumWeb Company web site. Everything you see on the demo is made available for you as a Visual Studio solution with full source code and documentation.

Background

The key idea of the Framework is to eliminate routine time-consuming C# coding by providing developer with Metadata driven application engine. Instead of writing DataAccess classes and ASCX/WinForm/Silverlight controls, the developer defines Entities, Attributes, Relations, Commands as well as UI Elements like Frames, Panels and Tabs as XML Metadata. This approach significantly increases development speed and saves costs at Support stage.

XML Metadata

Consider an example - you have some "Customer" table in the DB and would like to implement Customer Search/View/Edit/New forms.

All you need to do for this is define the Metadata listed below:

  <entity id="Customer" plural_caption="Customers"  single_caption="Customer"
             db_object="Customers" image_id ="Sample_Customer">
    <attributes>
      <attribute id="Id" primary_key="true" type="int"
                 visible="false"  default="=@sequence" />
      <attribute id="FirstName" caption="First Name" type="string"
                 max_length="50" nullable="false" />
      <attribute id="LastName" caption="Last Name" type="string"
                 max_length="50" nullable="false" />
      <attribute id="ContractDate" caption="Contract Date"
                 type="date" default="=SQL.select getdate()" />
      <attribute id="ContractFileContent" caption="Contract File" type="file"
                 nullable="true" filterable ="false" />
      <attribute id="CreditLimit" caption="Credit Limit"
                 type="float" default="100" />
      <attribute id="IsActive" caption="Is Active" 
                 type="boolean" />
      <attribute id="Notes" caption="Notes" type="string"
                 control_width="3" max_length="2000" />
    </attributes>
  </entity>

Developers can write XML metadata files manually or use our metadata generator tool to create XML files by given DB structure within seconds.

Automatically Generated User Interface

After we add this metadata to our application, this will create the following User Interface screens automatically, without a single line of C# code.

Search Form

Search form allows user to filter data by any of the attributes defined in MetaData. Different search operators can be selected for every attribute: Equal, Starts With, Between, Greater, Like, Not Empty, Is Empty, etc. For large search forms with big number of attributes, it is possible for the developer to move some of rarely used filters to the "Advanced Search" panel that is hidden by default. Also it is made possible to add any custom search criteria and map them to SQL patterns that will be used when building result SQL select statement.

Data Grid

Search results are displayed in DataGrid. It is made possible for user to re-open search form at any time for further adjustment of filter criteria. In Silverlight Framework, DataGrid supports sorting, paging and inline data editing. In ASP.NET and WinForms frameworks, DataGrids have more comprehensive functionality like Grouping, Grid Hierarchy, Layout customization, Storing of search criteria defined by the user for future use, etc.

Edit Form

Based on metadata definitions, Framework Engine automatically creates Entity Edit form. By default, Framework chooses edit controls based on data type of the attribute (text box, date edit, file upload, number edit, checkbox, etc.), but it is made possible for the programmer to redefine any of the controls or entire form. Simple data validation is done automatically. Depending on attribute level security settings, Framework automatically hides or disables some of the attributes. For example – if we configure user role that is permitted to edit all Customer attributes except the Credit limit, then on the edit form framework will automatically create a text box in ReadOnly state for displaying the CreditLimit value but not allowing user to edit it. In a similar manner – if some user will not have permissions to see the credit limit value – then this attribute will become hidden on all entity forms – Search, List, Edit and View.

Entity View Form

Entity view form allows the user to see all entity attributes. It is possible to define complex layouts by grouping attributes in different panels and tabs.

File Upload Form

For BLOB/Image attributes, framework automatically creates user interface to upload and download files. There is no limit on the files size. For large files, it is possible to restart and continue upload operation if connection was broken.

It is worth mentioning that all the above Silverlight forms are completely created at runtime by our framework engine. If, for example, you would add a new attribute to the Customer metadata - it would automatically appear on all Search/List/View and Edit forms related to the customer entity. This example demonstrates the very basic framework features. The way we designed the framework allows building very complex UI with complex dependencies based on MetaData descriptions saving a lot of development time and costs.

See How It Works

Experienced .NET developers can now start framework evaluation by following technical documentation and simple steps described below:

1. Download RAD Framework Visual Studio project and tutorials accompanied with full source code
2. Configure Database and Web Service according to the installation procedure
3. Open our IssueTracker Application project, see how it works, examine full source code
4. Open Framework Tutorial project, create custom DB table and Silverlight Web UI within 15 minutes
5. Read the detailed Metadata Description manual, test its features
6. Create Custom Projects
7. Request assistance from FulcrumWeb, write to us at fw@fulcrumweb.com

To help beginner .NET developers to get started with our RAD Framework, we are now preparing a number of video tutorials, user friendly Database and WebService installation procedures and Metadata configuration wizards, which will all be available on our web site by the mid of September 2009.

Download Full Source Code

Please follow the link below to download RAD FrameWork source code and tutorial projects: Fulcrumweb_src.zip.

The package contains:

• License.doc: License Agreement
• InstallationNotes.doc: Installation Notes
• Tutorial1.doc: Guide to create RAD Framework plugin to access data in a custom DB table
• Framework Metadata Description.doc: Detailed Framework Metadata description
• Database \ FulcrumWeb_Demo.bak: Microsoft SQL Server 2005 Database backup file
• Sources\Tracker\Source\Tracker.sln: Microsoft Visual Studio 2008 Solution - IssueTracker project
• Sources\Tutorial\Source\Tutorial.sln: Microsoft Visual Studio 2008 Solution - Tutorial

Installation Instruction

1. Ensure the server machine has got these software units installed:
   • Microsoft .NET Framework 3.0 Service Pack 2
   • Microsoft .NET Framework 3.5 Service Pack 1
   • Microsoft Internet Information Services 5.1 (IIS). Perhaps, it’s enough if you’ve got a later version.
   • Microsoft SQL Server 2005
2. Unpack the archive to arbitrary directory
3. General note: instead of the "localhost" word below, you should use the alias default for the web-site you’re trying to host on. It could be an IP address of the web-site, or some custom alias. Otherwise the application web-service won’t work, and thereby the application itself will be unusable. Once you selected the right server name, you should further use it to access the web-application through the browser as well. To check the host header name of the web-site, please go to IIS console, open the Properties of the web-site holding the application, and on the "Web Site" tab click the "Advanced ..." button. There will be the list of applicable host header names. Prefer the defined one against an empty one. If there’s no name but default, then use the IP address or machine name.
4. Set the "Tracker" folder as a web shared folder. This can be done just through the context menu -> Properties -> "Web Sharing" tab -> "Share this folder" radio button item -> enter the name of the folder for the application (for instance, "Tracker") so that it will be hosted there (http://localhost/Tracker).
5. Go to Internet Information Services console (Control Panel -> Administrative Tools -> Internet Information Services), then find the folder of the application in the tree, right-click -> Properties, go to "Directory Security" tab, click the "Edit" button, and enable the first ("Anonymous access") checkbox. Apply the changes.
6. In the IIS console, application properties, go to the HTTP Headers tab and click the "File Types..." button in the "MIME Map" group. Then click the "New Type" button and fill in the extension ".xap" and MIME type "application/x-silverlight-app". Apply the changes.
7. Restore the database from the backup file (Tracker_2009_04_17.bak, for instance).
8. Edit the "Tracker\web.config" file:
   • First of all, set the right database connection string (means, change the database server name and database name to the right ones, as well as the login name and password). If you use Integrated Security option, please don't forget to add the ASPNET user to the list of users who can access the database.
   • Second, set the "AppServerUrl" variable to the right one, for example http://localhost/Tracker/Main.svc, it should be adjusted with your web-shared folder name.
9. Try to access the application using browser. By default, the address should be like http://localhost/Tracker/Default.aspx. Please make sure you entered the address with the same letter casing as you’ve pointed it out in the web.config file (this actually makes sense for the application folder name only). So, if the web.config contains "http://localhost/Tracker/Default.aspx", please do NOT enter in the browser address bar "http://localhost/tracker/Default.aspx", otherwise you won’t be able to login correctly. For now, we're thinking of how to remove this constraint.
10. When the login form shows up, enter the right credentials. For the administrator: login "admin", password "admin".

Assistance

If you have any questions or need further assistance from FulcrumWeb, write to us at fw@fulcrumweb.com.