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... |
ArticleColumns.asp<!--#include file = "/include/Startup.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.
// ============================================
// increment the parent articles counter
// sIncArticlePage = '';
// output relevant meta tags
Init( "Articles in columns" );
// output common top of page
Header( 'Articles in columns' );
// output page content
Content ( );
// output common bottom of page
Footer( );
// ============================================
// the content of this page - every page has a function 'Content' that
// is called above.
// ============================================
function Content ( )
{
Out ( '<td valign="top" class="content">' );
Out ( 'This page was inspired by a question by <b>Ken Hough</b> who asked how to display the articles in columns rather than <a href="AllArticles.asp">one long list</a>. Thinking that I\'d got some code tucked up my sleeve, I wrote this page, and then added the form so you can play with it!' );
// as always, the form is submitted to the same page so that
// all the logic for the form is in the same place. you'll see
// later where this is done.
var bSubmitted = (Request.Form.Count > 0);
var nColumns = 3;
// has the form been submitted?
if ( bSubmitted )
{
// get the data from the form...
nColumns = Request.Form ( 'columns' ) - 0;
}
// here's the form tag. the action attribute is the name of
// the file that will be called with the answer - in this case
// it's the same page. the method can be "post" to send the
// form data 'behind the scenes' or "get" to appending the
// data to the URL in the style page.asp?data1=a&data2=b
//
// use post most of the time - it's neater and "get" is limited
// in the amount of data that can be sent.
Out ( '<p><a href="ShowSource.asp?page=ArticleColumns"><img src="/images/source.gif" border="0" align="right"></a>' );
Out ( '<form action="/ArticleColumns.html" method="post">' );
Out ( 'Set the number of columns: ' );
Out ( '<input type="text" name="columns" size="3" value="' + nColumns + '"> ' );
Out ( '<input type="submit" value="Change columns">' );
Out ( '<form>' );
if ( bSubmitted )
{
// validate the number of columns
if ( nColumns < 1 || nColumns > 5 )
{
Out ( '<br><font color="red" size="+1">Keep the number of columns between 1 and 5!</font>' );
// reset to the default
nColumns = 3;
}
}
DBInitConnection ( );
DBGetRecords ( 'SELECT ShortDescr,URL,Hits FROM Articles ORDER BY Hits DESC' );
// find anything?
if ( oRecordSet.EOF )
{
Out ( 'No articles!' );
DBReleaseConnection ( );
}
else
{
// get number of records
var nRecs = 0;
// put data into array
var sArticles = new Array;
while ( !oRecordSet.EOF )
{
var sDescr = '' + oRecordSet ( 0 );
var sURL = '' + oRecordSet ( 1 );
var nHits = oRecordSet ( 2 ) - 0;
sArticles [ nRecs++ ] = sURL + '">' + sDescr.slice ( 2 ) + ' (' + nHits;
oRecordSet.moveNext ( );
}
DBReleaseConnection ( );
// having got the data, let's see how many rows I can fill
if ( nRecs <= nColumns )
{
// show in one column if insufficient data
for ( i=0; i<nRecs; i++ )
Out ( '<a href="' + sArticles [ i ] + ')</a><br>' );
}
else
{
var nRows = Math.ceil ( nRecs / nColumns );
Out ( '<p><table cellpadding="5" border="0">' );
for ( var nRow=0; nRow < nRows; nRow++ )
{
Out ( '<tr>' );
var nIndex = nRow;
for ( var nOffset=0; nOffset<nColumns; nOffset++)
{
Out ( '<td valign="top">' );
if ( nIndex < nRecs )
Out ( (nIndex+1) + ': <a href="' + sArticles [ nIndex ] + ')</a>' );
else
Out ( ' ' );
nIndex += nRows;
Out ( '</td>' );
}
Out ( '</tr>' );
}
Out ( '</table>' );
}
}
ShowBottomBanner()
Out ( '</td>' );
Out ( '<td background="/images/gx/navgap.gif" valign="top">' );
// show rotating banners
ShowBanners ( 1 );
Out ( '</td>' );
}
%> |
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. |