Developing lightweight markup using ASP.NET (or WebForms without forms)

John Avis by | June 9, 2012 | ASP.NET Web Forms ASP.NET Html Forms

There are times when I really like ASP.NET and times when I don't. Usually the times that I don't are when I don't have as much control over the final HTML markup as I would like, or when I look at the amount of JavaScript, ViewState and other markup that ASP.NET has added.
There are times when I really like ASP.NET and times when I don't. Usually the times that I don't are when I don't have as much control over the final HTML markup as I would like, or when I look at the amount of JavaScript, ViewState and other markup that ASP.NET has added.

Sometimes I miss the simplicity and control of Classic ASP. Wouldn't it be nice to have full control over the final markup and create lightweight code perhaps combined with jQuery? Lately I have been looking at alternatives to ASP.NET Web Forms to use instead.

ASP.NET MVC looks like an option but still has a lot of controls that generate HTML for you (although I'm sure they are optional). I have tried a little in MVC but I haven't quite got my head around it yet.

ASP.NET Web Pages (Razor) looks real interesting. You can code "top to bottom" like Classic ASP, and still access external classes. Like Classic ASP though your code is largely exposed in CSHTML files.

PHP also has a lot of the features of Classic ASP, and also many features of ASP.NET but although I have coded a little in PHP I miss the Visual Studio development environment and many features of ASP.NET.

Lately I have been wondering about the possibility of using ASP.NET Web Forms but without the form runat="server" tag. Without this tag, ASP.NET does not seem to add anything to the page at all. From some basic tests it seems that it runs well and you still have the ability to use code-behind pages, and many ASP.NET controls such as repeaters.

A post at Enterprise Software Development (link broken, use this instead) lists the controls that do and don't require a server-side form tag.

From that list you will see that all of the form elements like TextBoxes, DropDownLists, RadioButtons, etc cannot be used without a server-side form tag. Instead you use normal HTML form controls. But how do you access these HTML controls from the code behind?

Retrieving values on post back is easy, you just use Request.QueryString or Request.Form.

But passing data to the control could be a little messy. Do you use a ASP.NET Literal control in the value field or do you use <%= value %> in the markup page? I found it best to add runat="server" to my HTML controls and then you can access the control in your code-behind like this: ((HtmlInputText)txtName).Value = "blah";

There is a problem with adding runat="server" however. ASP.NET then replaces the name attribute of the control, even if you have the ClientIDMode set to static. I can't see a way around this.

Here's a example that shows what you can do with a textbox and drop down list:

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="NoForm.Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form action="" method="post">
<label for="txtName">Name:</label>
<input id="txtName" name="txtName" runat="server" /><br />
<label for="ddlState">State:</label>
<select id="ddlState" name="ddlState" runat="server">
<option value=""></option>
</select><br />
<input type="submit" value="Submit" />
</form>
</body>
</html>


Default.aspx.cs

using System;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;

namespace NoForm
{
public partial class Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//Default values
string name = string.Empty;
string state = string.Empty;

if (Request.RequestType == "POST")
{
//If form submitted (post back)
name = Request.Form["txtName"];
state = Request.Form["ddlState"];

//Server side form validation would go here
//and actions to process form and redirect
}

((HtmlInputText)txtName).Value = name;

((HtmlSelect)ddlState).Items.Add(new ListItem("ACT"));
((HtmlSelect)ddlState).Items.Add(new ListItem("NSW"));
((HtmlSelect)ddlState).Items.Add(new ListItem("NT"));
((HtmlSelect)ddlState).Items.Add(new ListItem("QLD"));
((HtmlSelect)ddlState).Items.Add(new ListItem("SA"));
((HtmlSelect)ddlState).Items.Add(new ListItem("TAS"));
((HtmlSelect)ddlState).Items.Add(new ListItem("VIC"));
((HtmlSelect)ddlState).Items.Add(new ListItem("WA"));

if (((HtmlSelect)ddlState).Items.FindByValue(state) != null)
((HtmlSelect)ddlState).Value = state;
}
}
}


As you can see, you have similar functionality to ASP.NET server controls but more control over the final markup, and less overhead like ViewState and all the JavaScript ASP.NET adds.

We've had WebForms, WinForms, MVC and WebPages. I'm going to call this ASP.NET HtmlForms.

Useful links:

Related Posts

Bootstrap ASP.NET Web Forms

ASP.NET Web Forms and Bootstrap 3 Modals

by John Avis | July 6, 2017

There are a few methods for hiding and showing Bootstrap 3.x modals in an ASP.NET Web Forms application. This technique is pure ASP.NET (requires no client script) and allows you to show and hide modals by changing the Visible property of a containing PlaceHolder or Panel.


ASP.NET Web Forms

Disable common UpdateProgress controls for an UpdatePanel with an associated UpdateProgress

by John Avis | April 12, 2017

If you have an ASP.NET Web Forms page with multiple UpdatePanels and multiple UpdateProgress controls, sometimes you may want one or more UpdateProgress controls associated with a specific UpdatePanel, and one or more UpdateProgress controls that have no association with an UpdatePanel so are shown when any UpdatePanel is updated.


Bootstrap ASP.NET Web Forms

Bootstrap checkbox-inline and radio-inline with ASP.NET CheckBoxList and RadioButtonList controls

by John Avis | June 20, 2016

Although you can easily create inline checkboxes and radio buttons using ASP.NET CheckBoxes and RadioButtons using Bootstrap's checkbox-inline and radio-inline classes, it's not so easy with ASP.NET CheckBoxList and RadioButtonList controls.

Comments

There are no comments yet. Be the first to leave a comment!

Leave a Comment
Tags
ASP.NET Html Forms ASP.NET MVC ASP.NET Web Forms ASP.NET Web Pages Bootstrap C# Classic ASP Cool Websites Databases eBay and PayPal Electrical Repairs General Hardware HTML/CSS Jquery/Javascript Media Center Mobile Phones Responsive Web Design SEO and Social Networking Web Design Web Development Web Security web+db Website Hosting Windows XP

About me

...mostly about web development and programming, with a little bit of anything else related to the Internet, computers and technology.

Subscribe

Get the latest posts delivered to your inbox.