Once an Access Form has been translated into a WebForm, you will want to undertake some minor adjustments to the layout. This article shows how to adjust the form layout that uses absolute control positioning in Visual Wed Developer Express 2008.

Firstly part of the original Access Form.

Below we see the corresponding translated WebForm. Which whilst being extremely close in layout to the Access Form may require some minor adjustments to the layout.

Aligning absolute positioned controls

Start by viewing the WebForm in design using Visual Web Developer or Visual Studio, and click to select the Form area, then use the popup to edit the template.

The popup can also be used to end template editing, or change from editing the Item Template to the EditItemTemplate.

When it comes to positioning controls in VWD 2008 unfortunately selecting multiple controls is not possible (this was possible with Visual Studio 2005), see the following thread for a full discussion of this http://forums.asp.net/t/1170907.aspx; it looks like VS 2010 will allow this. So for VS 2008 each individual control needs to be selected and moved (also notice that when editing the template you can also see the SqlDataSource controls in the view).

Here are some tips on moving and re-sizing the controls.

Whilst the mouse can be used to drag and resize controls,the arrow keys can be used to move the control up, down, left and right with greater precision.

Using the Ctrl key and left, right arrow keys a text box can me made larger or smaller, and using the up, down arrow keys made taller or shorter (this unfortunately does not work for a DropDownList).

You can see from below that positioning a set of controls and aligning them without the ability to make multiple control selections is extremely difficult. Getting an approximate position is not that difficult.

The easiest way complete the final alignment is to select each control in the split view, and directly edit the position. Below we see the desired Left position of 31px we want for alignment.

Now moving to the control that we wish to align which has a Left 26px.

Now edit the left position changing it from 26 to 31.

After making the change you will need to swap back into editing the template.

Resulting in the final desired alignment.

Whilst we all await VS 2010 and support for multiple control selection, the above technique is a practical solution to this problem in VS 2008.

Top of Page

DetailsView

One approach to avoid these layout issues is to use a DetailsView control to provide a fixed layout for the fields.

With the DetailsView you have far less control on the layout other than re-ordering the fields, but adjusting the layouts requires less work.

Top of Page

Relative Positioning

A third option is to use a FormView control, but use relative control positioning where the control layout flows with the page, as shown below.

MUST+Web gives you the flexibility of supporting all the above layout options when converting your Access Forms into WebForms.

Top of Page

MUST+WEB converting Access Databases to .net with Visual Studio or Visual Studio Express. Supports development in Visual Basic and C# using either SQL, LINQ or EntityData Model data sources. Click below to improve your development productivity.

Top of Page

by Andrew Couch Office Access MVP, Director ASC Associates andy@ascassociates.biz