Dynamic Form Display with RadioButtonList

When developing user interfaces it’s often key to remember all the tricks and tools available to you so that you may combine them in creative ways in order to implement more advanced features. Given the sometimes limiting postback mechanism it’s important to make every refresh count, and to provide a unique experience by taking advantage of the postback server processing.

There are 2 particular server components that work together quite nicely to form a creative user interface experience: The RadioButtonList and the floating DIV tag. When combining these components we can create an almost wizard-like interface using some advanced GUI tricks in tandem with the postback events.

In this tutorial we will build an ASP.NET application with 2 dynamic pseudo “forms”, and we will then implement a RadioButtonList to simply flip between the 2 forms dynamically on the page. Although the forms will appear as layered on top of each other we’ll see how we can design the forms side-by-side in the design environment and then layer them together in server code.

By implementing AutoPostBack on the RadioButtonList we’ll show how we can create post backs and dynamically display the selected form to the user, creating a dynamic space in a small amount of screen space allowing for multiple entry screens without using the entire width and height of the page.