Code On Time: User Interface

Blog

User Interface

Monday, August 2, 2010Print Subscribe

Q. How can I disable the New and Delete button on any particular page.

Consider using WhenHRef property of data controller actions. Open the data controller definition in Designer, select Actions tab and activate the action. The action property WhenHRef must represent a valid regular expression.

For example, If you want to use New and Delete actions on pages ~/Pages/Page1.aspx and ~/Pages/Page2.aspx only then the following syntax will work.

Page1|Page2

The assumption is made that the same data controller is present on both pages. You can use any valid regular expression to create a URL test. The expression will be tested against the URL in the web browser address box. A more precise and complex expression may look as the one below:

/Pages/Page(1|2)\.aspx

If there are other pages that use the same data controller and you want to prevent New and Delete actions from displaying on Page1 and Page2 but have them available on all other pages then we recommend to use an extension to regular expression syntax. Simply put "false:" in front of your expression:

false:Page1|Page2

The prefix in the example above is not a part of regular expression definition and is used to make it easier writing negative regular expression then would have been required otherwise.

Labels: Data Aquarium Framework, Tips and Tricks, User Interface

Friday, July 23, 2010Print Subscribe

Displaying Picture Field in Summary And Not in Grid

Q. What is the secret to displaying an image in the summary pane but hide it in the grid?
I can get the photo to display in the summary and grid, but not the summary only.

The summary requires the field to be physically present in the grid/form view.

The secret is to display an invisible picture field in the grid instead of hiding the field altogether.

For example, suppose you have generated the Northwind sample application with Web Site Factory. The grid view of product categories will show each category inline as you can see at http://dev.codeontime.com/demo/websitefactory1/pages/categories.aspx. If you select a category then the category Picture will be displayed in the summary on the side bar as well.

Open the project in Visual Studio and expand ~/App_Themes folder. Add new CSS file StyleSheet.css in the project.

Enter the following CSS rule:

.DataView .Cell.Picture, .DataView .FieldHeaderSelector.Picture
{
    display: none;
}

Save the file.

Run the program and observe the Picture field to disappear from presentation when you select a category.

Labels: AJAX, Application Factory, ASP.NET, Tips and Tricks, User Interface, Web 2.0

Tuesday, July 20, 2010Print Subscribe

Permalinks

The ability to create a shortcut to application data is crucial if you are building a true web 2.0 experience. Data shortcuts (also known as permalinks) allow users to create new data processing techniques and workflow patterns.

The screenshot below shows creation of a permalink in action:

A permalink is created when you select a master record on the page and click Permalink hyperlink on the membership bar of your application.

Copy the link to the clipboard and paste it for further use and reference. You can also create an instant browser bookmark to your data if you click on Add to Favorites button. The bookmark title will automatically include some of the data from the summary of the selected record.

If you paste the link in a web browser then you will be instantly redirected to the corresponding page of your application with the record selected when the page is displayed. If you are not signed in then a prompt to authenticate will be presented to protect data referenced by permalink from unauthorized access.

Labels: AJAX, Application Factory, ASP.NET, Data Aquarium Framework, User Interface, Web 2.0