Click here to Skip to main content
12,302,863 members (76,129 online)
Click here to Skip to main content

Stats

22.2K views
618 downloads
45 bookmarked
Posted

Selectable GridView with WaitBox

, 16 Oct 2008 CPOL
This article describes how to implement a selectable GridView control in ASP.NET.
WaterGrid
App_Code
NewsItems.xss
App_Data
Bin
AjaxControlToolkit.dll
Images
bar_bk.gif
bar_line.gif
bg_nav.gif
Thumbs.db
PreRequisites
AjaxControlToolkit.dll

/* Overall Page */

body
{
	margin: 0;
	padding-bottom: 2em;
	background-color: #FFFFFF;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}


/* Main Content */

#content
{
	margin-top: 1em;
	margin-left: 16em;
	margin-right: 2em;
}
h1
{
	font: 150% Arial, Helvetica, Georgia, "Times New Roman" , Times, serif;
}
#content p
{
	font-size: 12px;
	line-height: 1.6em;
}

#content ul
{
	font-size: 12px;
	line-height: 1.6em;
}

.textboxEditMode
{
	height: 13px;	
}

.UpdatingProgress 
{ 
	display: none;
	background-color:#F5F7F8;
	border-width:2px;
	border-style:solid;
	border-color:Black;
	font-size:15px;
	font-family: tahoma;
	font-weight: 500;
	padding:3px;
	width:260px;
	height: 100px;
} 

.inputfields
{
	font-size: 8pt;
	font-family: tahoma;
	width: 100%;
	height: 19px;
	border: 1px solid #7b9ebd;
}

.adminInfo
{
	text-align: center;	
}

.waiting
{
	cursor: wait;	
}

.completed
{
	cursor: auto;	
}

.inputFont
{
	font-size: 10pt;
	font-family: tahoma;
}

.listTest
{
	z-index: 2;	
}

td.borderleft
{
	border-left: 1px solid #9900CC;
}

td.tableheader
{
	background-image: url(./Images/bar_bk.gif);
	border-top: 1px solid #5C5858;
	border-bottom: 1px solid #5C5858;
	border-right: 1px solid #5C5858;
	padding-left: 6px;
	padding-top: 3px;
	padding-bottom: 3px;
	text-align: left;
	font-size: 8pt;
	font-family: tahoma;
}

.simpleText
{
	font-size: 10pt;
	font-family: tahoma;
}

.selectedRow
{
	background-image: url(./Images/bg_nav.gif);
	border-top: 2px solid black;
	border-bottom: 2px solid black;
}
.disabled
{
	background-color:#98AFC7;	
	border: 1px solid #7b9ebd;
}

.invalid
{
	background-color:#FF0000;	
	border: 1px solid black;
}

.enabled
{
	background-color: White;	
	border: 1px solid #7b9ebd;
}
td.dataRow
{
	
	padding-left: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-top: 0px;
}

.unselectedRow
{
	border-width: 0px;
	border-style: none;
}

.gridResults
{
	margin-left: 40px;
}

/* Data Web Control Styles */

.DataWebControlStyle
{
	font-size: 90%;
}

.HeaderStyle
{
	background-color: #900;
	color: White;
	font-weight: bold;
}

.AlternatingRowStyle
{
	background-color: #fcc;
}

.RowStyle
{
}
.sidebar
{
	width: 100%;
	margin-bottom: 10px;
}

.sidebarheader
{
	height: 24px;
	padding: 10px 0 0 35px;
	background: url(images/sidebar_header.png) no-repeat left top;
	color: #FFF;
	font-family: Arial, Sans-Serif;
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
}

.sidebarcontent
{
	border: 1px solid #0F2543;
	padding: 20px 20px 20px 30px;
	line-height: 1.5em;
	font-weight: bold;
}

#master_sidebarSamples
{
	padding-top: 72px;
	background: #FFF url(images/samples_bg.gif) no-repeat left top;
}

#master_sidebarWalkthroughs
{
	padding-top: 72px;
	background: #FFF url(images/walkthrough_bg.gif) no-repeat left top;
}

.sidebarcontent a
{
	padding: 2px 5px;
	color: #5377A9;
	text-decoration: none;
}

.sidebarcontent a:hover
{
	background-color: #0F2543;
	color: #FFF;
}

.sidebarcontent a:visited
{
	font-weight: normal;
}

#master_content
{
	float: left;
	width: 550px;
	margin-right: -550px;
	color: #666666;
}

/*
#master_content a
{
	color: #5377A9;
	padding: 1px;
}

#master_content a:link
{
}

#master_content a:visited
{
}

#master_content a:hover
{
	background-color: #BFBFBF;
	color:#FFF;
}
*/

#master_content ul
{
	margin: 0 25px 0 30px;
}

#master_contentheader
{
	height: 19px;
	background: url(images/rightcoltop.gif) no-repeat right top;
}

#master_contentplaceholder
{
	padding: 30px 20px 40px 20px;
	border-left: 1px solid #0F2543;
	border-right: 1px solid #0F2543;
	border-bottom: 1px solid #0F2543;
	border-top: 1px solid #0F2543;
	background-color: #EFEFEF;
	line-height: 1.5em;
}

#master_contentfooter
{
	clear: both;
	padding: 10px 0 5px 10px;
	color: #333;
	font-size: 0.8em;
	letter-spacing: 0.1em;
}

/* Content Page Layout             */
.demoarea
{
	padding: 20px;
	background: #FFF url(images/demotop.png) no-repeat left top;
}

.demoarea p
{
	padding: 5px;
}

.demoheading
{
	padding-bottom: 20px;
	color: #5377A9;
	font-family: Arial, Sans-Serif;
	font-weight: bold;
	font-size: 1.5em;
}

.demobottom
{
	height: 8px;
	background: #FFF url(images/demobottom.png) no-repeat left bottom;
}


.heading
{
	color: #5377A9;
	font-family: Arial, Sans-Serif;
	font-weight: bold;
	font-size: 1.1em;
}

.subheading
{
	padding: .8em 0 0.5em 0;
	color: #0F2543;
	font-family: Arial, Sans-Serif;
	font-size: 1.1em;
}

p
{
}

em
{
	font-style: italic;
}

i
{
	font-style: italic;
}

strong
{
	font-weight: bold;
}

.codeReference
{
	font-family: 'Courier New' , Monospace;
	font-style: normal;
	font-weight: bold;
}

pre, code
{
	display: block;
	margin: 15px 15px 15px 0;
	padding: 10px;
	border: 1px dashed #CCC;
	background-color: #FFF;
	color: #000;
	font-family: 'Courier New' , Monospace;
	font-size: 0.9em;
	font-style: normal;
}

.releaseList
{
	list-style-type: disc;
}


/* Styles for the Animation Reference */
.animationReferenceTable
{
}

.animationReferenceRow
{
}

.animationReferenceField
{
	text-align: right;
	vertical-align: top;
	padding-top: 5px;
}

.animationReferenceCode
{
	margin-top: 5px;
	vertical-align: top;
	font-family: 'Courier New' , Monospace;
	font-style: normal;
	font-weight: bold;
	display: block;
	background-color: #FFF;
	color: #000;
	font-family: 'Courier New' , Monospace;
	font-size: 0.9em;
	font-style: normal;
	font-weight: bold;
	margin-bottom: 5px;
}

.animationReferenceItems
{
	vertical-align: top;
}

.animationReferenceItemTable
{
	width: 100%;
	padding: 0px;
	margin: 0px;
}

.animationReferenceItemRow
{
	width: 100%;
	padding: 0px;
	margin: 0px;
}

.animationReferenceItem
{
	width: 100%;
	padding: 0px;
	margin: 0px;
	padding-bottom: 10px;
}

.animationReferenceItemCode
{
	display: block;
	background-color: #FFF;
	color: #000;
	font-family: 'Courier New' , Monospace;
	font-size: 0.9em;
	font-style: normal;
	font-weight: bold;
}

/******************************/
/**Styling information specific to individual content pages**/

/* Accordion */
.accordionHeader
{
	border: 1px solid #2F4F4F;
	color: white;
	background-color: #2E4d7B;
	font-family: Arial, Sans-Serif;
	font-size: 12px;
	font-weight: bold;
	padding: 5px;
	margin-top: 5px;
	cursor: pointer;
}

#master_content .accordionHeader a
{
	color: #FFFFFF;
	background: none;
	text-decoration: none;
}

#master_content .accordionHeader a:hover
{
	background: none;
	text-decoration: underline;
}

.accordionContent
{
	background-color: #D3DEEF;
	border: 1px dashed #2F4F4F;
	border-top: none;
	padding: 5px;
	padding-top: 10px;
}

/* DropShadow */

#master_content .dropShadowPanel span
{
	color: white;
	text-decoration: underline;
}
#master_content .dropShadowPanel span:hover
{
	text-decoration: none;
}


.dropShadowPanel
{
	width: 300px;
	background-color: #5377A9;
	color: white;
	font-weight: bold;
}

/*Hover Menu*/
.popupMenu
{
	position: absolute;
	visibility: hidden;
	background-color: #F5F7F8;	
	width: 115px;
	font-size: 12px;
}

.popupHover
{
	background-image: url(images/bar_bk.gif);
	background-repeat: repeat-x;
	background-position: left top;
	background-color: #F5F7F8;
}

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Iwona Les
Software Developer (Junior) Artaker Computersysteme GmbH
Austria Austria
I've began programming at the Warsaw University of Technolog. Currently I'm trying hardly;) to finish a master program at Vienna University of Technology and at the same time I'm working as Software Developer.
I'm interested in Web Development, technologies like AJAX, Silverlight, Semantic Web etc.

You may also be interested in...

| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.160530.1 | Last Updated 16 Oct 2008
Article Copyright 2008 by Iwona Les
Everything else Copyright © CodeProject, 1999-2016
Layout: fixed | fluid