Nice tips on some ASP.Net 20 Form handling
10,000 Monkeys has a nice overview of two slightly obscure things in web development: multiple buttons on a form triggered by the enter key and forms without tables. Check here for the info:
Multiple enter key buttons
Forms without tables
if you have two different sets of inputs with save buttons, you can place them in a panel and set the default button for input fields in that panel. Like so:
| Code: |
No more tables -- only CSS
No more tables -- only CSS
| Code: |
<table>
<tr>
<td>Name:</td><td><input type="text" name="name"/></td>
</tr>
<tr>
<td>Email:</td><td><input type="text" name="email"/></td>
</tr>
<tr>
<td>Phone:</td><td><input type="text" name="phone"/></td>
</tr>
<tr>
<td>Address:</td><td><input type="text" name="address"/></td>
</tr>
<tr>
<td>City:</td><td><input type="text" name="city"/></td>
</tr>
</table>
You can use CSS to style the lablel elements like so:
<style type="text/css">
fieldset
{
width: 16em;
}
label
{
font-size: 1em;
width: 5em;
float: left;
margin-right: 0.5em;
display: block;
}
#rightAligned label
{
text-align: right;
}
</style>
<fieldset id="rightAligned">
<legend>Right Aligned</legend>
<p><label for="name">Name:</label><input type="text" name="name"/></p>
<p><label for="email">Email:</label><input type="text" name="email"/></p>
<p><label for="phone">Phone:</label><input type="text" name="phone"/></p>
<p><label for="address">Address:</label><input type="text" name="address"/></p>
<p><label for="city">City:</label><input type="text" name="city"/></p>
<input type="button" class="btn" value="Save"/>
</fieldset>
|