| This page shows the actual source code used on this site. You can read the article that discusses this code here. If this is the first CYA source code you've seen you should read this overview first. Did you know you can download all the source code (and the database) of this site? Then get my newsletter to be emailed when I update the source code! Please spread the word by recommending my site to your friends and colleagues! This is JScript (server-side JavaScript), not the more common VBScript. More... |
Columns.asp<!--#include file = "/include/Startup.html"-->
<!--#include file = "/utils/ShowCategory.html"-->
<%
// ============================================
// NOTE: all source code downloaded from CoverYourASP was written by
// James Shaw (unless stated otherwise), and is copyright (c) 2000-2002
// by James Shaw. You can use the code for any purpose, but do not
// publish or distribute the content in any way.
//
// See http://CoverYourASP.com/Legal.asp for up-to-date details.
// ============================================
// output relevant meta tags
Init( "Categories in columns", "Categories, yahoo, category, portal" );
// output common top of page
Header( 'Categories in columns' );
// output page content
Content ( );
// output common bottom of page
Footer( );
// ============================================
// the content of this page
// ============================================
function Content ( )
{
Out ( '<td valign="top" class="content">' );
Out ( 'Following on from my <a href="/Categories.html">earlier category demonstration</a>, and listening to many users comments, I\'ve now added a small amount of extra code to wrap the categories into any number of columns.' );
Out ( '<p>Here I\'ve shown two, just to silence those of you that pointed out that I hadn\'t "Implemented categories just like Yahoo" (picky, picky), but I\'ve written the code to cope with any number of columns/categories.' );
// to keep it pretty, I'll just get the first two top-level categories from the database
DBInitConnection ( );
// top level categories have the same CategoryID and TopCategoryID, so you\'d use SQL like this:
// var sSQL = 'SELECT CategoryID FROM Categories WHERE CategoryID=TopCategoryID';
// but for this example, where I only have two top-level categories, I'll demonstrate the principle
// by pretending that the "Computers and Internet" sub-categories are top-level...
var sTopCategory = 'Computers and Internet';
DBGetRecords ( 'SELECT CategoryID FROM Categories WHERE ParentCategoryID=\'' + sTopCategory + '\'' );
var sTop = new Array ( );
var i;
// loop through all the categories
for ( i=0; ; i++ )
{
// I want to skip the first '*' category
oRecordSet.MoveNext ( );
// quit when I'm at EOF
if ( oRecordSet.EOF )
break;
// you MUST use "" + syntax.
sTop [ i ] = "" + oRecordSet ( 0 );
}
DBReleaseRecords ( );
// having got the data, let's see how many rows I can fill
var nColumns = 2; // set this to number of columns
if ( sTop.length < nColumns )
{
// show in one column if insufficient data
for ( i=0; i<sTop.length; i++ )
ShowCategory ( sTopCategory, sTop [ i ] );
}
else
{
Out ( '<p><table cellpadding="5">' );
for ( var nRow=0; nRow < sTop.length; nRow+=nColumns )
{
Out ( '<tr>' );
for ( var nOffset=0; nOffset<nColumns; nOffset++)
{
Out ( '<td>' );
var nIndex = nRow + nOffset;
if ( nIndex < sTop.length )
ShowCategory ( sTopCategory, sTop [ nIndex ] );
else
Out ( ' ' );
Out ( '</td>' );
}
Out ( '</tr>' );
}
Out ( '</table>' );
}
// release connection
DBReleaseConnection ( );
Out ( '<p><center><a href="/ShowSource_page_Columns.html"><img src="images/source.gif" border=0></a></center>' );
ShowBottomBanner()
Out ( '</td>' );
Out ( '<td background="images/gx/navgap.gif" valign="top">' );
// show rotating banners
ShowBanners ( 2 );
Out ( '</td>' );
}
%> |
utils/ShowCategory.asp<%
// ============================================
// NOTE: all source code downloaded from CoverYourASP was written by
// James Shaw (unless stated otherwise), and is copyright (c) 2000-2002
// by James Shaw. You can use the code for any purpose, but do not
// publish or distribute the content in any way.
//
// See http://CoverYourASP.com/Legal.asp for up-to-date details.
// ============================================
// ============================================
// show the top category and as many sub-categories as will fit in <50
// characters
// ============================================
function ShowCategory ( sOffset, sTop )
{
var sTopURL = '<a href="CategoryPage.asp?cat=';
// if I'm given an sOffset then I'll prefix all URLs with it
// this helps me when I'm demonstrating using a database
// with only 3 levels (at most) of sub-category - see Columns.asp
if ( sOffset.length )
sTopURL += Server.URLEncode( sOffset ) + '&cat=';
sTopURL += Server.URLEncode( sTop );
Out ( '<p><font size=3><b>' + sTopURL + '" title="Browse ' + sTop + ' categories">' + sTop + '</a></b></font><br>' );
DBGetRecords ( 'SELECT CategoryID FROM Categories WHERE ParentCategoryID=\'' + sTop + '\'' );
var sSubs = "";
var sSep = "";
var nLen = 0;
// show sub-categories until more than 50 characters
while ( !oRecordSet.EOF )
{
var sSub = "" + oRecordSet ( 0 );
nLen += sSep.length + sSub.length;
if ( nLen > 50 )
break;
sSubs += sSep + sTopURL + '&cat=' + Server.URLEncode( sSub ) + '">' + sSub + '</a>';
sSep = ", ";
oRecordSet.MoveNext ( );
}
DBReleaseRecords ( );
Out ( sSubs + '..' );
}
%> |
utils/Database.asp<%
// ============================================
// NOTE: all source code downloaded from CoverYourASP was written by
// James Shaw (unless stated otherwise), and is copyright (c) 2000-2002
// by James Shaw. You can use the code for any purpose, but do not
// publish or distribute the content in any way.
//
// See http://CoverYourASP.com/Legal.asp for up-to-date details.
// ============================================
// globals
var oConnection;
var oRecordSet;
// enums
// Connection.State and Recordset.State property
var adStateClosed = 0; // the object is closed.
var adStateOpen = 1; // the object is open.
var adStateConnecting = 2; // the object is connecting.
var adStateExecuting = 4; // the object is executing a command.
var adStateFetching = 8; // the rows of the object are being fetched.
// Recordset.Cursor property
var adOpenUnspecified = -1; // does not specify the type of cursor.
var adOpenForwardOnly = 0; // (default) a forward-only cursor, i.e. you get only one pass thru the data!
var adOpenKeyset = 1; // can go in any direction, and as a bonus you'll see changes other users make. EXPENSIVE!
var adOpenDynamic = 2; // as Keyset, but also you can see additions/deletions other users make. EXPENSIVE!
var adOpenStatic = 3; // can go in any direction, but read-only.
// Recordset.LockType property
var adLockUnspecified = -1; // does not specify a type of lock.
var adLockReadOnly = 1; // (default) guess!
var adLockPessimistic = 2; // guaranteed to work
var adLockOptimistic = 3; // records locked only when you call Update. fingers crossed
var adLockBatchOptimistic = 4;// required for batch update mode
var adCmdUnspecified = -1; // Does not specify the command type argument.
var adCmdUnknown = 8; // Default. Indicates that the type of command in the CommandText property is not known.
var adCmdText = 1; // a textual definition of a command or stored procedure call.
var adCmdTable = 2; // a table name whose columns are all returned by an internally generated SQL query.
var adCmdStoredProc = 4; // a stored procedure name.
var adCmdFile = 256; // a persisted Recordset.
var adCmdTableDirect = 512; // a table name whose columns are all returned.
// SchemaEnum - specifies the type of schema Recordset to be retrieved by the OpenSchema method
var adSchemaTables = 20; // returns the tables
var adSchemaForeignKeys = 27 // returns the foreign keys (relationships)
// ============================================
// example usage:
// DBInitConnection ( );
//
// DBGetRecords ( "SELECT * FROM Somewhere" );
//
// ...use oRecordSet
//
// DBReleaseRecords ( ); // optional step
//
// DBGetRecords ( "SELECT * FROM SomewhereElse" );
//
// ...use oRecordSet
//
// DBReleaseRecords ( ); // optional step
//
// DBReleaseConnection ( );
// ============================================
// ============================================
// initializes database variables for first use on page - leave it to the
// last possible second before calling this function
// ============================================
function DBInitConnection ( )
{
// don't open it again if already opened!
if ( oConnection != undefined )
return;
// don't bother trying to open if path is below SSI folders
if ( -1 != sDBPath.indexOf ( '\\utils\\' ) || -1 != sDBPath.indexOf ( '\\include\\' ) )
return;
// you can open Recordset objects without a Connection object, but
// it's far less efficient if you are opening multiple Recordsets.
//
// if you don't create a Connection object ADO creates a new one for
// each new Recordset.Open, even if you use the same connection string.
oConnection = Server.CreateObject( 'ADODB.Connection' );
try
{
// open the database, catching any errors that occur
oConnection.Open( sConnectionString );
}
catch ( e )
{
// display error message, and send email
DatabaseException ( e );
// quit running the script completely
Response.End ( );
}
// create a Recordset
oRecordSet = Server.CreateObject( 'ADODB.Recordset' );
}
// ============================================
// tidies up after DBInitConnection
// ============================================
function DBReleaseConnection ( )
{
// don't release the connection if not connected!
if ( oConnection == undefined )
return;
// close and delete the Recordset object
DBReleaseRecords ( );
oRecordSet = undefined;
// Don't call Close if the Recordset failed to Open properly, i.e. its
// State is still adStateClosed (0)
if ( oConnection.State != adStateClosed )
oConnection.Close();
oConnection = undefined;
}
// ============================================
// executes the passed in SQL statement and returns a read-only
// forward-only oRecordSet object
// ============================================
function DBGetRecords ( sSQL )
{
// if the Recordset is already open, close it
DBReleaseRecords ( );
// I could use oRecordSet = oConnection.Execute( sSQL ) here
// but then I will always get back a read-only, forward-only cursor.
// (admittedly this is the most used type, but still)
// use oRecordSet.Open and I have far more control. For details
// read the definitions of the enums at the top of this file.
//Out ( sSQL );Response.Flush();
try
{
// remember that this can fail if passed garbage, and hence the
// Recordset will remain closed, State == adStateClosed
if ( oConnection )
oRecordSet.Open ( sSQL, oConnection, adOpenForwardOnly, adLockReadOnly );
}
catch ( e )
{
// display error message, and send email
DatabaseException ( e );
// quit running the script completely
Response.End ( );
}
}
// ============================================
// tidies up after DBGetRecords
// ============================================
function DBReleaseRecords ( )
{
// when you have finished with an open Recordset object, call the
// Close method to release its resources. You can call Open again.
// Don't call Close if the Recordset failed to Open properly, i.e. its
// State is still adStateClosed
if ( oRecordSet != undefined && oRecordSet.State != adStateClosed )
oRecordSet.Close();
}
// ============================================
// display exception message, but strip out database path if necessary
// ============================================
function DatabaseException ( e )
{
Out ( '<table bgcolor="#ff0000" cellpadding="20"><tr><td>' );
Out ( '<h4><font color="white">An error has occured while connecting to the database:</font></h4>' );
var sMessage = e.description;
// strip out the database path if present
var nStart = sMessage.indexOf ( sDBPath )
if ( -1 != nStart )
sMessage = sMessage.slice ( 0, nStart ) + '[database path]' + sMessage.slice ( nStart + sDBPath.length );
Out ( '<h4> "' + sMessage + '"</h4>' );
Out ( '<h4><font color="white">Don\'t despair - this problem is probably well-documented in my <a href="http://CoverYourASP.com/Trouble.asp"><font color="white">trouble-shooting</font></a> section.</font></h4>' );
Out ( '</td></tr></table>' );
// make up the message body
var sBody = 'The file "' + Request.ServerVariables ( "URL" ) + '?' + Request.QueryString ( ) + '" generated a database error\n\n';
sBody += 'Referrer: "' + Request.ServerVariables ( "HTTP_REFERER" ) + '".\n';
sBody += 'Browser: "' + Request.ServerVariables ( "HTTP_USER_AGENT" ) + '".\n';
sBody += 'IP address: "' + Request.ServerVariables ( "REMOTE_ADDR" ) + '".\n';
var dateToday = new Date();
sBody += 'Time: "' + dateToday.getHours() + ':' + dateToday.getMinutes() + '".\n';
sBody += sMessage;
// send the email
SendEmail ( 'Database.Exception', 'BadDB@' + sHostDomain, '', 'Reporting exception', sBody );
}
// ============================================
// are we using Jet engine db, or SQL server?
// ============================================
var bUsingJet;
function DBIsJet ( )
{
// for efficiency, only work out if which I'm using
// the first time I'm used on a page.
if ( bUsingJet == undefined )
bUsingJet = ( -1 != sDBDriver.indexOf ( '.Jet.' ) );
return bUsingJet;
}
// ============================================
// wrap date in relevant delimeters depending on db engine
// ============================================
function DBWrapDate ( sDate )
{
return ( DBIsJet ( ) ? '#' + sDate + '#' : '\'' + sDate + '\'' );
}
// ============================================
//
// ============================================
function DBIsNull ( )
{
return ( DBIsJet ( ) ? 'Is Null' : '= null' );
}
// ============================================
// stores dropdown lists in Application variables for use with foreign keys
// ============================================
function DBGatherForeignKeys ( )
{
if ( !Application ( 'GatheredForeignKeys' ) )
{
DBInitConnection ( );
bDebug = true;
oRecordSet = oConnection.OpenSchema ( adSchemaForeignKeys );
var nFields = oRecordSet.Fields.Count;
var bHeaders = false;
var sRefTables = new Array;
var sRefColumns = new Array;
var sForeignTables = new Array;
var sForeignColumns = new Array;
var nForeign = 0;
while ( !oRecordSet.EOF )
{
if ( IsDebug ( ) )
{
if ( !bHeaders )
{
Out ( '<table border="1"><tr>' );
for ( i=0; i<nFields; i++ )
Out ( '<td>' + oRecordSet.Fields ( i ).Name + '</td>' );
Out ( '</tr>' );
bHeaders= true;
}
Out ( '<tr>' );
for ( i=0; i<nFields; i++ )
Out ( '<td>' + oRecordSet ( i ) + '</td>' );
Out ( '</tr>' );
}
sRefTables [ nForeign ] = '' + oRecordSet ( 'FK_TABLE_NAME' );
sRefColumns [ nForeign ] = '' + oRecordSet ( 'FK_COLUMN_NAME' );
sForeignTables [ nForeign ] = '' + oRecordSet ( 'PK_TABLE_NAME' );
sForeignColumns [ nForeign++ ] = '' + oRecordSet ( 'PK_COLUMN_NAME' );
oRecordSet.MoveNext ( );
}
if ( bHeaders )
DebugOut ( '</table>' );
for ( i=0; i<nForeign; i++ )
{
DBGetRecords ( 'SELECT * FROM ' + sForeignTables [ i ] );
try
{
var sList = '<select name="' + sRefColumns [ i ] + '">';
var sForeignColumn = sForeignColumns [ i ];
while ( !oRecordSet.EOF )
{
// I assume that the second field is
// the one to show in dropdown list
sList += '<option value="' + oRecordSet ( sForeignColumn ) + '">' + oRecordSet ( 1 ) + '</option>';
oRecordSet.MoveNext ( );
}
sList += '</select>';
Application ( sRefTables [ i ] + ':' + sRefColumns [ i ] ) = sList;
DebugOut ( '<p>Created ' + sRefTables [ i ] + ':' + sRefColumns [ i ] );
DebugOut ( '<p>' + sRefColumns [ i ] + '=' + sForeignTables [ i ] + ':' + sForeignColumn + ' output:'+ Server.HTMLEncode ( sList ) + sList );
}
catch ( e )
{
DebugOut ( '<p>Failed to create dropdown list for ' + sRefTables [ i ] + ':' + sRefColumns [ i ] );
}
}
DBReleaseConnection ( );
Application ( 'GatheredForeignKeys' ) = true;
}
}
// ============================================
// display (not editable) recordset column value
// ============================================
function DBDisplayValue ( oRecordSet, sTableName, nColumn )
{
var sColumnName = oRecordSet.Fields ( nColumn ).Name;
var oValue = oRecordSet ( nColumn );
// get dropdown list if a foreign key
var sHTML = Application ( sTableName + ':' + sColumnName );
// DebugOut ( '<p>Application ( ' + sTableName + ':' + sColumnName + '=' + sHTML );
if ( sHTML )
{
// disable control
var nIndex = sHTML.indexOf ( ' name' );
if ( nIndex != -1 )
sHTML = sHTML.slice ( 0, nIndex ) + ' disabled' + sHTML.slice ( nIndex );
// place 'selected' in the correct spot
var nIndex = sHTML.indexOf ( ' value="' + oValue );
if ( nIndex != -1 )
sHTML = sHTML.slice ( 0, nIndex ) + ' selected' + sHTML.slice ( nIndex );
}
else
{
// show prettier dates
if ( oValue.Type == 7/*date*/ )
sHTML = FormatDateDMY ( oValue );
else
sHTML = "" + Server.HTMLEncode ( '' + oValue );
// for brevity show the first x characters only
if ( sHTML.length > 35 )
sHTML = sHTML.slice ( 0, 35 ) + '...';
}
return sHTML;
}
// ============================================
// display editable recordset column value
// ============================================
function DBEditValue ( oRecordSet, sTableName, nColumn )
{
var sColumnName = oRecordSet.Fields ( nColumn ).Name;
var oValue = oRecordSet ( nColumn );
// get dropdown list if a foreign key
var sHTML = Application ( sTableName + ':' + sColumnName );
// DebugOut ( '<p>Application ( ' + sTableName + ':' + sColumnName + '=' + sHTML );
if ( sHTML )
{
// place 'selected' in the correct spot
var nIndex = sHTML.indexOf ( ' value="' + oValue );
if ( nIndex != -1 )
sHTML = sHTML.slice ( 0, nIndex ) + ' selected' + sHTML.slice ( nIndex );
}
else
{
// show prettier dates
if ( oValue.Type == 7/*date*/ )
sHTML = FormatDateDMY ( oValue );
else
sHTML = "" + Server.HTMLEncode ( '' + oValue );
sHTML = '<input type="text" name="' + sColumnName + '" size="45" value="' + sHTML + '">';
}
return sHTML;
}
// ============================================
// return value with ' replaced by SQL-safe ''
// ============================================
function DBEncode ( sValue )
{
return sValue.replace ( /\'/g, '\'\'' );
}
%>
|
The Categories tableThe layout of the table is simple. There are three fields: CategoryID, ParentCategoryID and TopCategoryID. The entire database is contained in the download. Hopefully much of this is self-explanatory. If not, or if you see ways that I can improve the code, please drop me a line. To see the source code for this page, click on the icon below. | |