Alright. I am making a school project using Visual Web Developer, and I need to use a Master Page. When I make a new web form based on my master page, it inherits the colors of the master page, but there is a table which is not inherited. Here is my master page code:
<%# Master Language="VB" CodeFile="Master1.master.vb" Inherits="Master1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server" background-color: #00FF00;>
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<style type="text/css">
.auto-style2 {
height: 57px;
width: 2363px;
}
.auto-style3 {
height: 57px;
width: 48px;
}
.auto-style4 {
height: 48px;
}
.newStyle1 {
background-color: #FF00FF;
}
.auto-style5 {
width: 369px;
height: 214px;
}
</style>
</head>
<body style="background-color: blue;">
<form id="form1" runat="server">
<div class="newStyle1">
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
<table class="newStyle1">
<tr>
<td class="auto-style4" colspan="2">
<asp:Menu ID="Menu1" runat="server" Orientation="Horizontal">
<Items>
<asp:MenuItem NavigateUrl="Default.aspx" Text="Home" Value="Home"></asp:MenuItem>
<asp:MenuItem NavigateUrl="About.aspx" Text="About" Value="About"></asp:MenuItem>
</Items>
</asp:Menu>
</td>
</tr>
<tr>
<td class="auto-style3">
<img alt="CS Logo" class="auto-style5" src="cSk.png" /></td>
<td class="auto-style2">
<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
</td>
</tr>
<tr>
<td class="auto-style4" colspan="2"></td>
</tr>
</table>
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
Master Page VB Code:
Partial Class Master1
Inherits System.Web.UI.MasterPage
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
End Sub
End Class
Web Form Attempted to Inherit Master Page:
%# Page Title="" Language="VB" MasterPageFile="~/Master1.master" %>
<script runat="server">
</script>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
</asp:Content>
You should only place HTML elements inside placeholders in a master page if you wish to overwrite this content in subsequent child pages.
The problem with your child page is that it overwrites the placeholder containing the table with empty HTML.
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
</asp:Content>
If you wish to inherit content, do not place shared content in placeholders.
If you must adopt this practice of placing shared content in placeholders, do not overwrite this content in the child page. So in your example:
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
</asp:Content>
Would display the table in the master page.
Hope that helps.
Related
I am learning knockout and trying out a small example below are the the three files that I have:
index
introduction
introduction
I am using netbeans IDE for the development .
index.html
<!DOCTYPE html>
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script data-main="js/main" src="js/libs/require/require.js" type="text/javascript"></script>
<link href="css/libs/oj/v2.1.0/alta/oj-alta-min.css" rel="stylesheet" type="text/css"/>
<style>
table, th, td {
border: 1px solid black;
padding: 15px;
}
th {
text-align: left;
}
thead{
border-style: double;
font-weight: bold ;
}
tr {
text-align: left;
}
{background-color: #f5f5f5}
</style>
</head>
<body>
<div data-bind="ojModule: {name: 'introduction'}"></div>
</body>
</html>
viewModels - introduction.js
/**
* introduction module
*/
define(['ojs/ojcore', 'knockout',oj,jquery,require
], function (oj, ko) {
/**
* The view model for the main content view template
*/
function introductionContentViewModel() {
var self = this;
self.firstName = ko.observable("Planet");
self.lastName = ko.observable("Earth");
self.fullName = ko.pureComputed(function () {
return this.firstName() + " " + this.lastName();
}, this);
this.fullName= this.firstName() +" " +this.lastName();
this.resetName=function(){
alert("Reset Name!");
this.firstName("James");
this.lastName("Potter");
};
this.capitalizeName=function(){
var curValue=this.lastName();
this.lastName(curValue.toUpperCase());
};
function seatReservation(fname,lname, reservMeals){
this.firstName=fname;
this.lastName=lname;
this.meals = ko.observable(reservMeals);
/* this.formattedPrice=ko.computed(function(){
var price = this.meals.price;
return price ? "$" + price.toFixed(2):"none";
});*/
};
this.mealsAvailable=[{mealName:"SandWich",price:25},
{mealName:"Roti",price:23},
{mealName:"Dal",price:22}];
self.seats = ko.observableArray([
new seatReservation("Steve","Hawkins", this.mealsAvailable[0]),
new seatReservation("Bert","Baltymoore", this.mealsAvailable[1])
]);
//function to add new reservation into the table
this.newReservationRow=function(){
this.seats.push(new seatReservation("","",this.mealsAvailable[0]));
};
}
return introductionContentViewModel;
});
views -introduction.html
<body>
<form>
<div class='liveExample'>
<p> First Name: <span data-bind='text: firstName'/> </p>
<p> Last Name: <span data-bind='text: lastName'/> </p>
<p>First name: <input data-bind='value: firstName' /></p>
<p>Last name: <input data-bind='value: lastName' /></p>
<h2>Hello, <span data-bind='text: fullName'> </span>!</h2>
<button data-bind='click: resetName' >Reset Name </button>
<button data-bind='click: capitalizeName'>Capitalize </button>
<input type='submit' data-bind='click: resetName' value='Reset'/>
</div>
<div class="Reservations">
<h2>Reservations </h2>
<table>
<thead> <tr><td> FirstName </td><td> LastName</td> <td> Meals</td><td> Price</td></tr></thead>
<tbody data-bind="foreach: seats">
<tr>
<td><input data-bind="value: firstName"/> </td>
<td><input data-bind="value: lastName"/> </td>
<td><select data-bind="options: meals,optionsText:'mealName'"></select> </td>
<td data-bind="text: meals().price"> </td>
</tr>
</tbody>
</table><br>
<input type="submit" value="New Reservation" label="New Reservation" title="Click to Make a New Reservation" data-bind="click: newReservationRow"/>
</div>
</form>
</body>
I am not getting the desired out put. The desired output is something like this in the below link
http://learn.knockoutjs.com/#/?tutorial=collections
You are mixing self and this a lot in your code. I recommend cleaning that up first and see if things start working for you. Personally, I like to stay with self.xxxx format.
Also, remove the reference to "require" inside of your define block in the introduction.js file. That may be causing some issues. Either way, it's not needed.
Finally, it appears you are doing all of this using Oracle JET. Since the introduction.html is a view that will be used inside of ojModule, you do not need to have the < body> element defined a second time. The introduction.html is going to be a fragment that will take the place of the < div> that you have bound to ojModule.
I am currently learning SQL. On my CFM page I have entered all the information from the instructions my professor has given us. I have even compared to other students to try and figure out what is wrong, but their pages look like mine. Please help me figure out what I have done wrong. Thanks.
This is the webpage link http://pretendcompany.com/jaedenemployees.html
Error:
72777A, on line 66, column 32, is not a valid identifer name. The CFML
compiler was processing: The body of a CFOUTPUT tag beginning on line
62, column 3.
Code:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="YOUR NAME HERE" />
<title>USU MIS 2100</title>
<style type="text/css" media="all">
td {
align:center;
width:955;
border:none;
text-align:center;
vertical-align:top;
height:40px;
}
table.center{
margin:auto;
}
h1{
font-size:26px;
color:#001F3E;
}
h2{
font-size:20px;
color:#ffffff;
}
img{ text-align:center;
}
td.photo{
margin:auto;
}
</style>
</head>
<body>
<table class="center">
<tr>
<td ><img src="images/header2_usu.jpg" width="755" height="265" alt="usu" /></td>
</tr>
<tr>
<td style="height:900;background-color:#D7D9D9;padding-top:50px;">
Employees by Department at Pretend Company, Inc.</font></p>
<h1>Jaeden Harris</h1>
<CFQUERY name="jaeden" datasource="employeedatasource">
select Accounting,Administrative,Advertising,Payroll,Sales
from employees
where DepartmentName in(#PreserveSingleQuotes(form.SelectDepts)#)
</CFQUERY>
<!--Place opening CFOUTPUT here -->
<CFOUTPUT query="jaeden">
<table style="width:500;border:none;" class="center">
<tr style="background-color:#72777A;">
<td colspan="2"><h2> #DepartmentName# Employees </h2></td>
</tr>
<tr>
<td style="width:250;text-align:left;">Employee:#FirstName# #MiddleName# #LastName#
<p>Title: #Title#
<p>Email: #EmailName# #pretendcompany.com
<p>Contact Number: #WorkPhone#
</p>
</td>
<td style="width:140px;vertical-align:middle;" class="photo"><!--Reference Photograph field here --> </td>
</tr>
</table>
</CFOUTPUT>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
You are within a CFOUTPUT, therefor anything with # signs gets evaluated, including the style background-color:#72777A;. Either escape those with a double hash: background-color:##72777A; or move the style out of your CFOUTPUT.
Since you already have a section for your CSS, it may be wise for you to move all your table styles from inline with the HTML to the top and just apply classes to your elements.
I am now learning Dojo. So I want to build my first demo by how to use gauges in Dojo.
I downloaded the zip package and build an asp.net web project. then all the resources from Dojo package are imported to this project.
Because I saw the demo from DoJo website: http://demos.dojotoolkit.org/demos/gauges/demo.html, So I want to copy this demo in my local computer with existing DoJo resources.
HTML code below:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DojoDaemon.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>Dojo Circular Gauge Test Daemon</title>
<link href="Styles/Site.css" rel="stylesheet" type="text/css" />
<script src="Scripts/dojo-release-1.9.1/dojo/dojo.js" type="text/javascript" data-dojo-config="async:true"></script>
<script src="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/CircularLinearGauge.js"
type="text/javascript" data-dojo-config="async:true"></script>
<script src="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/HorizontalLinearGauge.js"
type="text/javascript" data-dojo-config="async:true"></script>
<script src="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/SemiCircularLinearGauge.js"
type="text/javascript" data-dojo-config="async:true"></script>
</head>
<body>
<form runat="server" id="form1">
<h2 align="center" style="color:white;">Predefined Glossy Gauges</h2>
<table style="height:100%; width:100%">
<tr>
<td align="center">
<div id="CircularGauge" background="{color:'rgba(0,0,0,0)'}" useTooltip="false" data-dojo-type="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/CircularLinearGauge" style="width:200px;height:200px" value="20"></div></td>
<td align='center'>
<div id="CircularGauge2" background="{color:'rgba(0,0,0,0)'}" useTooltip="false" data-dojo-type="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/SemiCircularLinearGauge" value="10" style="width:250px;height:200px"></div></td>
</tr>
<tr>
<td valign="middle" align="center" colspan="2">
<div id="HGauge3" style="margin:30px 0px 0px 0px;width:400px;height:60px" useTooltip="false" background="{color:'rgba(0,0,0,0)'}" data-dojo-type="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/HorizontalLinearGauge" value="20"></div></td>
</tr>
</table>
</form>
</body>
</html>
Above is the code I use, I have searched a lot of examples, but got nothing because no one article give me the detailed steps to teach me how to use the resources in dojox folder.
resources I found like :
http://dojotoolkit.org/api/dojox/dgauges/CircularGauge
http://dmandrioli.github.io/dgauges/dojox/dgauges/CircularGauge.html
Would anyone help me if familar with this? thank you ver much.
You only need to load dojo.js in the src and the src.js which they have included for the demo. Click on the View Source of http://demos.dojotoolkit.org/demos/gauges/demo.html and copy the code exactly!
Dojo can seem like a beast at first, but its a beautiful toolkit that you will come to love and appreciate. Give it time. I STRONGLY recommend you say Hi to Dojo before jumping to dguage and other advanced stuff.
I am storing old html markup in my database, tracking changes, and then trying to render the diff using Differ and the :html format option.
The following code is successfully generated:
<table>
...
<tr>
<th style="width:60px; text-align:left;">
Owner:
</th>
<del class="differ">
<td>
<span id="someID">Previous Owner Name</span>
</td>
</del>
<ins class="differ">
<td>
<span id="someID">Current Owner Name</span>
</td>
</ins>
</tr>
...
</table>
Notice the <del> and <ins> tagged elements.
If I view the source, it looks fine.
But because apparently this would disrupt the table layout, all browsers seem to move these new elements to before the table. When I inspect the element, I get the following:
<del class="differ"> </del>
<ins class="differ"> </ins>
<table>
...
<tr>
<th style="width:60px; text-align:left;">
Owner:
</th>
<td>
<span id="someID">Previous Owner Name</span>
</td>
<td>
<span id="someID">Current Owner Name</span>
</td>
</tr>
...
</table>
I tried writing a custom Rails view helper to replace each <ins> and <del> with a <span>, but the same thing happens.
Is there a way to style the table using elements like I am trying to do, or am I going to have to walk the dom and apply styles to each appropriate <td> using javascript? I cannot replace the tables in the beginning because I don't control the source.
Thanks to David & Steve for confirming the issue, I was able to resolve this specific case by translating the <ins> and <del> tags into classes, and applying them to each child element using Nokogiri prior to rendering the view.
I created a table_safe helper as follows:
def table_safe(markup)
parsed = Nokogiri.parse(markup)
parsed.css('ins').children().each do |el|
if el['class']
el['class'] = el['class'] << ' ins'
else
el['class'] = 'ins'
end
end
parsed.css('del').children().each do |el|
if el['class']
el['class'] = el['class'] << ' del'
else
el['class'] = 'del'
end
end
parsed.to_s
end
This can obviously be refactored, but it solves the problem. Ideally I could modify the :html formatting option in the Differ gem so that it inserts the tags inside of the first nested element if that element itself has not changed. I'm not sure why this isn't the default functionality, but it is outside the scope of my capabilities.
Why not add a CSS stylesheet to copy the style class differ to all TD elements?
<link rel="stylesheet" type="text/css" href="some.css" />
And then a definition like this in the stylesheet:
td {
padding: 15px;
background-color: gold;
text: black;
font-family: Courier, "Courier New", Tahoma, Arial, "Times New Roman";
border: 1px solid black;
/* Some other properties here...... */
}
And a sample HTML:
<!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>
<title>Anything</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="ja.css" />
</head>
<body bgcolor="white" text="black">
<table>
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</body>
</html>
Working example:
http://pastehtml.com/view/ckdf6rxo3.html
Maybe this W3Schools link will be useful:
CSS Styling Tables
I am developing a VB.NET program. I currently have an ASP Textbox with a label showing inside it. But now the customer has to manually delete this label before entering their own text. How do I get this label to vanish as soon as they begin typing?
My script is nearly working now for txtFind. But in this case, it shows a different textbox to display watermark image. How can I reset this watermark to only activate the txtFind textbox instead? And to remove the textbox on left-hand side? Here is my new ASPX file code:
<script type="text/javascript" language="javascript" >
function GetChart(thepart, thepartdesc, thecolor, row)
{
Form1.part_transfer.value = thepart;
Form1.part_desc_transfer.value = thepartdesc;
Form1.submit();
}
</script>
<head>
<title></title>
<style type="text/css">
.DataGridFixedHeader {background-color: #336699; color:White; font-weight: "bold"; position:relative; top:expression(this.offsetParent.scrollTop);}
#txtWatermark{ width:150; padding:5px; outline:none; height:20px; }
.focusField{ border:solid 2px #73A6FF; background:#EFF5FF; color:#000; }
.idleField{ background:#EEE; color: #6F6F6F; border: solid 2px #DFDFDF; }
</style>
</head>
<body>
<form runat="Server" defaultbutton= "btnFind" method="post" id="Form1">
<div style="font-size:18pt; font-family:verdana; font-weight:bold; color:#336699">
Parts Watch List
</div>
<hr style="font-weight: bold; font-size: 20pt; color:#000080;" />
<div style="height: 380px; text-align: center; position: static;">
<input id="part_transfer" type="hidden" runat="server"/>
<input id="part_desc_transfer" type="hidden" runat="server"/>
<asp:Panel id="Panel1" runat="server" HorizontalAlign = "Center">
<span style="font-weight: bold; text-align: left; font-size: 15pt;">
Calculation:</span><br />
Reliability Rate = 1 - ( number of failed parts in the last 6 months / Part Multiplier * Average instrument Census in the last 6 months),<br />
Where
<br />
Number of failed parts - Summation of failures of a part for a 6 month period<br />
Part Multiplier - Number that represents how many times a part is used on the intrument<br />
Average instrument census - Average of the instrument census for the same
6 month timeframe as failed parts<br />
<br />
Please choose one of the parts below to view the control charts.</p>
</asp:Panel>
<asp:Panel id="Panel2" runat="server" Visible="false">
<chart:WebChartViewer id="WebChartViewer1" runat="server" HorizontalAlign="Center" />
</asp:Panel>
</div>
<hr style="width: 90%; position: static;" />
<div style="text-align: center; position: static; ">
<asp:Label id="CensusLastUpdate" runat="server"/><br />
<asp:Button id="btnExport" runat="server" Text="Export to Excel"></asp:Button>
<asp:CheckBox id="check1" Text="Display Only Parts Below Threshold" TextAlign="Right" AutoPostBack="True" OnCheckedChanged="ReRun_Main" runat="server" />
<asp:TextBox ID="txtFind" Text="Enter Part Number" runat="server" />
<asp:Button ID="btnFind" Text="Search" runat="server" OnClick="SearchTable" />
</div>
<% Dim scrollPosURL As String = "../includes/ScrollPos.htc"%>
<input id="saveScrollPos" type="hidden" runat="server" name="saveScrollPos"/>
<input name="txtWatermark" id="txtWatermark" value="Type something here" type="text"/>
<table border="0" cellspacing="0" align="center" style="border-collapse:collapse;position:relative;left:-9">
<tr>
<td>
<div style="OVERFLOW: auto; HEIGHT: 400px; vertical-align: top; ">
<ASP:DATAGRID ID="dgTable" HorizontalAlign="Center" runat="server" AutoGenerateColumns="False" ShowHeader="True" OnItemDataBound="DataGrid1_ItemDataBound">
<AlternatingItemStyle BackColor = "#eeeeee" />
<HEADERSTYLE CssClass="ms-formlabel DataGridFixedHeader" />
<COLUMNS>
<ASP:BOUNDCOLUMN HEADERTEXT="PN" DATAFIELD="PART_NUM" READONLY="true" ItemStyle-Width="130px" ItemStyle-Font-Size="8"/>
<ASP:BOUNDCOLUMN HEADERTEXT="PART_DESC" DATAFIELD="PART_DESC" READONLY="true" ItemStyle-Width="150px" ItemStyle-Font-Size="8"/>
<ASP:BOUNDCOLUMN HEADERTEXT="numFailed" DATAFIELD="NUM_FAILED" READONLY="true" ItemStyle-Width="150px" ItemStyle-Font-Size="8"/>
<ASP:BOUNDCOLUMN HEADERTEXT="AvgCensus" DATAFIELD="AVG_CENSUS" READONLY="true" ItemStyle-Width="150px" ItemStyle-Font-Size="8"/>
<ASP:BOUNDCOLUMN HEADERTEXT="PartMultiplier" DATAFIELD="PartMultiplier" READONLY="true" ItemStyle-Width="150px" ItemStyle-Font-Size="8"/>
<ASP:BOUNDCOLUMN HEADERTEXT="ReliabilityRate" DATAFIELD="RELIABILITY_RATE" READONLY="true" ItemStyle-Width="105px" ItemStyle-Font-Size="8"/>
<ASP:BOUNDCOLUMN HEADERTEXT="PRIORITY" DATAFIELD="PRIORITY" READONLY="true" Visible="False" ItemStyle-Width="0px" ItemStyle-Font-Size="8"/>
<ASP:BOUNDCOLUMN HEADERTEXT="Criticality" DATAFIELD="Criticality" READONLY="true" ItemStyle-Width="105px" ItemStyle-Font-Size="8"/>
</COLUMNS>
</ASP:DATAGRID>
</div>
</td>
</tr>
</table>
</form>
<!-- Javascript at the bottom for fast page loading -->
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.js" type="text/javascript"></script>
<script type="text/javascript"> window.jQuery || document.write('<script src="js/libs/jquery-1.6.1.js">\x3C/script>')</script>
<!-- Scripts concatenated -->
<script src="js/plugins.js" type="text/javascript"></script>
<script src="js/script.js" type="text/javascript"></script>
<!-- End scripts -->
</body>
</html>
Check out this working jsFiddle demo:
HTML:
<input name="status" id="status" value="Type something here" type="text"/>
CSS:
#status{
width:150;
padding:5px;
outline:none;
height:20px;
}
.focusField{
border:solid 2px #73A6FF;
background:#EFF5FF;
color:#000;
}
.idleField{
background:#EEE;
color: #6F6F6F;
border: solid 2px #DFDFDF;
}
jQuery:
var $input = $("#status"),
defaultVal = $input[0].defaultValue;
$input.addClass("idleField");
$input.focus(function() {
$input.toggleClass("idleField focusField");
if ($input.val() === defaultVal) { $input.val(""); }
else { $input.select(); }
});
$input.blur(function() {
$input.toggleClass("focusField idleField");
if ($.trim($input.val()) === "") { $input.val(defaultVal); }
});
EDIT - Based on comments, to use jQuery in your ASPX file:
</form>
<!-- Javascript at the bottom for fast page loading -->
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.js" type="text/javascript"></script>
<script type="text/javascript"> window.jQuery || document.write('<script src="js/libs/jquery-1.6.1.js">\x3C/script>')</script>
<!-- Scripts concatenated -->
<script src="js/plugins.js" type="text/javascript"></script>
<script src="js/script.js" type="text/javascript"></script>
<!-- End scripts -->
</body>
In the script.js is where you would put the jQuery I posted above.
If you are working in ASP, you will need to do some client-side javascript calls to clear out the textbox when it gets the focus. Here is an article on how to do this:
http://forums.asp.net/t/1085050.aspx/1
If you are using Winforms (the question was a bit unclear), you could do this through an event on the textbox (probably the GotFocus event). You would evaluate the box to see if it has the default text (like "enter name here") and if it did you would wipe it out.
Both of these solutions follow the same pattern of tapping into an event to tell you when to clear out the box. Don't forget to make sure it is the text you put in the box. Otherwise if the user comes back to change something in the box, you will wipe out their data.
You could also get trickier and if the user leaves the textbox without entering data, you could put the original default text back in the textbox.
Use the TextBoxWaterMark extender from the AjaxControlToolkit. It's all done for you!
<asp:textbox runat="server" id="FirstNameTextBox" />
<ajaxtoolkit:TextBoxWaterMarkExtender TargetControlId="FirstNameTextBox"
WatermarkText="Enter Your First Name" />