This code will allow you to change the background colour of a cell or entire row depending on certain conditions.
In this example we test if the row being bound is a data row, then if the second column (indexed as 1) is equal to 0. If it is then the row's backcolor is set as PeachPuff and the cell itself has backcolor Salmon. Remember that cell indexing starts at 0 so that the first column is e.Row.Cells(0), the second column e.Row.Cells(1), etc.
Protected Sub grdTable_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles grdTable.RowDataBound
If e.Row.RowType = DataControlRowType.DataRow Then
When websites feature a text search and a table or list of results you will sometimes see something like:
73 records matched your search or 128 matches found.
This is actually very easy to do but incredibly hard to find an easy way of doing it. Here's how it's done.
This example is based on searching a company contact list.
Firstly, in your web form you need your DataSource and SelectCommand, for example:
<asp:SqlDataSource ID="srcResults" runat="server" ConnectionString="<%$ ConnectionStrings:constrConnectionString %>" SelectCommand="SELECT * FROM [contacts] WHERE [firstname] LIKE '%' + txtSearch + '%' OR [lastname] LIKE '%' + txtSearch + '%'">
Then, in your VB you get the number of records returned as follows:
Dim intMatches As Integer
Dim dv As Data.DataView
dv = CType(srcResults.Select(DataSourceSelectArguments.Empty), Data.DataView)
intMatches = dv.Count.ToString()
You will need to change srcResults in the third line to the ID of your DataSource control, the rest of the code can stay as it is.
Finally, you need to output the number of records to the page. This can be done by putting a Literal or Label control in the web form:
Here's some code which gives different output depending on whether there are 0, 1 or more than 1 record counted:
If intMatches = 0 Then
litRecordCountText.Text = "<span style='color:'cc0000'>Sorry, no contacts matched your search text.<br />Try entering just the first few letters of a name.</span>"
ElseIf intMatches = 1 Then
litRecordCountText.Text = "1 match found. The following contact matches your search."
Else
litRecordCountText.Text = intMatches & " matches found. The following contacts match your search."
End If
There's a tag in HTML which isn't very well known called <fieldset> which can be used to create some nice visual effects with having to use images or lines and lines of JavaScript.
Fieldset is basically used to group different elements in a form. It draws a box around content.
In IE7 by default it renders a box with a thin grey border and rounded corners. In Firefox by default it renders a box with a thin grey border but normal square corners. The corners can easily be rounded for Firefox with a bit of Mozilla specific CSS:
fieldset
{
-moz-border-radius:10px;
}
The 10px can be changed to create different amound of curvature. This means you have an area on screen with rounded corners without using any images or JavaScript, just simple HTML and CSS.
There's another HTML tag which can add a heading to the <fieldset> tag. This is the <legend> tag.
This renders by default as the legend wording sitting within the border top, breaking the border.
This can be a very effective way of heading a section especially with the right styling. This effect of breaking the border and positioning the heading text over it would use a few lines of CSS.
Here is the HTML code:
<fieldset>
<legend>Here is the legend</legend>
Here is the fieldset content.
</fieldset>
Example
You can see an example of fieldsets in use on this Corporate Hospitality website. This adds a border and a different colour to the <legend> tag.
When working with databases and the SQL DeleteCommand it may be a good idea to double check that this is what the user intended to do before risking permanently losing data. This is normally in the form of a pop up confirmation message with options of OK or Cancel.
It's very easy to implement. Here's how it's done. This example has a delete button in a GridView control.
<asp:GridView ID="grdContactNames" runat="server" DataSourceID="srcContacts" AutoGenerateColumns="false" DataKeyNames="ID">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" />
<asp:BoundField DataField="FirstName" HeaderText="First Name" />
<asp:BoundField DataField="LastName" HeaderText="Last Name" />
<asp:TemplateField>
<ItemTemplate>
<asp:Button ID="btnDelete" runat="server" Text="Delete" CommandName="Delete" OnClientClick="return confirm('Are you sure you want to delete this contact? Click OK to delete, Cancel to stop.');" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Instead of using a ButtonField as you might expect we use a TemplateField which allows us to add the OnClientClick property. You can then add your own confirmation message. The data record will only be deleted on confirming by clicking OK. No changes to the data source control are needed.
With a database driven site it's very useful if pages giving details of a specific product have that product name in the page title.
This sounds like it should be quite easy but it isn't. You can insert data from a field into a page quite easily by binding the data to a control. However, the ASP.NET controls have to sit with the <form> tags in the <body> of the HTML so binding data to the <head> section is more difficult.
It has to be done programmatically. Here how's it's done in VB.
Dim dv As Data.DataView
dv = CType(srcDataSourceControl.Select(DataSourceSelectArguments.Empty), Data.DataView)
Dim dr As Data.DataRowView = dv(0)
Dim strProductName As String = CStr(dr("ProductName"))
Dim strProductNumber As String = CStr(dr("ProductNumber"))
Dim strProductCategory As String = CStr(dr("ProductCategory"))
Page.Header.Title = strProductName & " - " & strProductNumber & " - " & strProductCategory
This example uses srcDataSourceControl as the data source control and assumes that the database table has fields called ProductName, ProductNumber and ProductCategory. You can bind as many fields as you like in this way.
The title is set by giving a string value to Page.Header.Title. This can be strings bound with DataView (strProductName) or bits of text in quote marks (" - ") joined by the & sign.
One final important thing. The <head> section in your page HTML must include the runat="server" to enable the header content to be manipulated on the server side.
Where you have a database of events you can easily exclude those which have gone by leaving only current and future events. However, getting the SelectCommand syntax right is not obvious.
SelectCommand="SELECT [EventName], [EventDate] FROM [EventsTable] WHERE DateValue([EventDate]) >= DATE() ORDER BY [EventDate]"
To show only current and future events add DateValue([EventDate]) >= DATE() to the WHERE clause of your data source SelectCommand. DateValue grabs the date value of your date field, DATE() returns today's date.
This can be varied to show dates in the past by changing the operator from ">=" to "<" or past and present "<=".
In this example, the DataList gets its data from the srcCategories AccessDataSource control but you could equally use any of the ASP.NET 2.0+ data source controls. Within the item template the "Category" value is used in the link URL and link text and the "RecordCount" value appears after the link in brackets.
The DataList control renders an HTML table and the RepeatColumns and RepeatDirection attributes just vary the layout of this table.
<asp:AccessDataSource ID="srcCategories" runat="server" DataFile="database.mdb"
SelectCommand="SELECT DISTINCT [Category], COUNT(ID) AS RecordCount FROM [EventsTable] GROUP BY [Category] ORDER BY [Category]">
</asp:AccessDataSource>
The AccessDataSource control's SelectCommand uses DISTINCT [Category] to show each category name only once, then a COUNT of the ID field named as RecordCount for use in the DataList control.
Loading ...
