ASP.NET 3.5

Labels
AJAX(112) App Studio(7) Apple(1) Application Builder(245) Application Factory(207) ASP.NET(95) ASP.NET 3.5(45) ASP.NET Code Generator(72) ASP.NET Membership(28) Azure(18) Barcode(2) Barcodes(3) BLOB(18) Business Rules(1) Business Rules/Logic(140) BYOD(13) Caching(2) Calendar(5) Charts(29) Cloud(14) Cloud On Time(2) Cloud On Time for Windows 7(2) Code Generator(54) Collaboration(11) command line(1) Conflict Detection(1) Content Management System(12) COT Tools for Excel(26) CRUD(1) Custom Actions(1) Data Aquarium Framework(122) Data Sheet(9) Data Sources(22) Database Lookups(50) Deployment(22) Designer(177) Device(1) DotNetNuke(12) EASE(20) Email(6) Features(101) Firebird(1) Form Builder(14) Globalization and Localization(6) How To(1) Hypermedia(2) Inline Editing(1) Installation(5) JavaScript(20) Kiosk(1) Low Code(3) Mac(1) Many-To-Many(4) Maps(6) Master/Detail(36) Microservices(4) Mobile(63) Mode Builder(3) Model Builder(3) MySQL(10) Native Apps(5) News(18) OAuth(8) OAuth Scopes(1) OAuth2(11) Offline(20) Offline Apps(4) Offline Sync(5) Oracle(10) PKCE(2) PostgreSQL(2) PWA(2) QR codes(2) Rapid Application Development(5) Reading Pane(2) Release Notes(179) Reports(48) REST(29) RESTful(29) RESTful Workshop(15) RFID tags(1) SaaS(7) Security(80) SharePoint(12) SPA(6) SQL Anywhere(3) SQL Server(26) SSO(1) Stored Procedure(4) Teamwork(15) Tips and Tricks(87) Tools for Excel(2) Touch UI(93) Transactions(5) Tutorials(183) Universal Windows Platform(3) User Interface(338) Video Tutorial(37) Web 2.0(100) Web App Generator(101) Web Application Generator(607) Web Form Builder(40) Web.Config(9) Workflow(28)
Archive
Blog
ASP.NET 3.5
Saturday, March 20, 2010PrintSubscribe
Custom Form Templates

Learn to create custom form templates to define the exact layout of data fields in form categories that meets your business requirements with Code OnTime Designer. The templates are based on HTML. Simple data field placeholders are automatically substituted in the client web browser.

 

Custom Form Templates in ASP.NET/AJAX Web Apps

Watch this tutorial on our YouTube channel at http://www.youtube.com/watch?v=OCobJ84wY7o.

This is the screen shot from the tutorial that shows a custom data field category of the form view editForm1 with the template from tutorial applied to it.

image

Here is the markup  of the custom form template used in this tutorial:

<table>
    <tr>
        <td valign="top">
            <div style="border: solid 1px silver; width: 400px; height:230px; background-color: white; padding: 8px;">
                <div class="FieldPlaceholder DataOnly">
                    {Photo}</div>
                <div class="FieldPlaceholder DataOnly" style="font-weight: bold; font-size: 16pt;">
                    {LastName}</div>
                <div class="FieldPlaceholder DataOnly" style="font-weight: bold; font-size: 16pt;">
                    {FirstName}</div>
                <div class="FieldPlaceholder DataOnly" style="width: 200px; margin-top: 8px;">
                    <div style="margin-left: 8px; color: dimgray;">
                        Notes:</div>
                    {Notes}</div>
                <div style="clear: both">
                </div>
            </div>
        </td>
        <td valign="top">
            <div style="border: solid silver 1px; height:230px; background-color: White; padding: 8px; margin-left: 8px;">
                <table>
                    <tr>
                        <td>
                            <div class="FieldPlaceholder">
                                {ReportsTo}</div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div class="FieldPlaceholder">
                                {Title}</div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div class="FieldPlaceholder">
                                {TitleOfCourtesy}</div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div class="FieldPlaceholder">
                                {HireDate}</div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div class="FieldPlaceholder">
                                {BirthDate}</div>
                        </td>
                    </tr>
                </table>
            </div>
        </td>
    </tr>
</table>
Sunday, November 8, 2009PrintSubscribe
Row Selection Mode

Component DataViewExtender allows control over selection mode of rows displayed in data controller grid views via SelectionMode property. The default property value is Single.

Here is the snippet of DataViewExtender definition from Customers.aspx page generated with Web Site Factory premium project from Northwind database. The SelectionMode property is set to Multiple.

<div factory:activator="Tab|Customers">
    <div id="view1" runat="server">
    </div>
    <aquarium:DataViewExtender ID="view1Extender" runat="server" 
TargetControlID="view1" Controller="Customers" View="grid1"
ShowInSummary="true" SelectionMode="Multiple" /> </div>

Here is how the page is displayed in a web browser.

image

We will also change the data controller ~/Controllers/Customers.xml to expose a new action a6 with command argument MyCommand on the action bar.

<actionGroup id="ag5" scope="ActionBar" headerText="Actions">
    <action id="a1" commandName="ExportCsv" headerText="Download" 
description="Download items in CSV format." /> <action id="a2" /> <action id="a3" commandName="ExportRowset" headerText="Export to Spreadsheet"
description="Analyze items with spreadsheet&lt;br/&gt; application." /> <action id="a4" commandName="ExportRss" headerText="View RSS Feed"
description="Syndicate items with an RSS reader." /> <action id="a5"/> <action id="a6" commandName="Custom" commandArgument="MyCommand"
headerText="MyCommand" description="My custom command."/> </actionGroup>

You can see the action displayed as a menu option on action bar of the grid view grid1.

image

Let’s add a business rule class Class1 and link it to the ~/Customers/Customers.xml data controller via /dataController/@handler attribute as described at /blog/2009/04/filtering-and-business-rules.html and /blog/2009/04/externalfilter-and-modal-views.html.

using System;
using System.Collections.Generic;
using System.Web;
using MyCompany.Data;

public class Class1: BusinessRules
{
    [ControllerAction("Customers", "grid1", "Custom", "MyCommand", ActionPhase.Execute)]
    public void MyCommand()
    {
        foreach (string customerId in Arguments.SelectedValues)
        {
            // do something here
        }
    }
}

Property SelectedValues is an array of string values. You might need to convert each value to the appropriate data type when writing custom business rules.

Set the breakpoint inside of foreach loop, open the page in a web browser, select a few records, and execute the action. The Visual Studio debugger will show the selected values as pictured below.

ControllerActionWebSiteFact

Sunday, November 1, 2009PrintSubscribe
Web Site Factory Preview 3

The new premium project Web Site Factory has been released and available to active premium project subscribers. Web Site Factory is based on Data Aquarium Framework and features sophisticated page layouts and professional user interface themes modeled after Microsoft SharePoint. The entire source code is included.

The final release supports four different standard page layouts that are consistently applied to all automatically generated pages. You can use Code OnTime Designer to modify this pages and to create the new ones.

You will find the live demo projects at:

Simple Page Layout

Simple layout provides a single data view on each page. A field summary of the selected record is displayed on the side bar on left-hand side of the page.

image

Tabbed Layout

Tabbed master-detail layout will place each data view on a dedicated tab so that only one data view is visible at any time. The details of the selected master record are automatically displayed on the side bar.

image

Inline Page Layout

Inline master-detail layout is similar to the tabbed layout with one exception. The tabs are not displayed. A set of tasks named after each data view is displayed at the top of the side bar instead. The details of the selected master record are automatically displayed on the side bar.

image

Stacked Layout

Stacked master-detail layout lists all data views. This allows simultaneous access to all master and child records. The details of the selected master record are automatically displayed on the side bar. Stacked pages are usually longer than the height of the window. The side bar summary automatically keeps itself in the view when browser window content is scrolled.

image

Conclusion

Learn more about Web Site Factory project features at /blog/2009/10/web-site-factory-preview-2.html. The article provides screenshots of Web Site Factory applications displayed in major modern web browsers.