Creating Display Search Result Page with Dreamweaver CS3, PHP 5 and MySQL 5

Create Display Search Result Page with dreamweaver CS3

Freelance Web Designer East Sussex

Link Exchange System with Dreamweaver CS3, PHP, MySQL and CSS Part 3

Get notified of the new tutorials

 

<<Search Engine | Latest Links Page>>

Display Search Result
This chapter will explain how to create a page which will display our search result.

Open links_search_result.php located inside of the resources folder in the root of your site. Identify the line which reads:

<?php include ('../includes/search_engine.php'); ?>

Place your cursor at the end of this line and crate a new line by hitting Enter on your keyboard. Now type:

<p id="title"><?php if (isset($categ) && $categ != "") { echo $row_rsLinks['catname']; } else { ?>Search result<?php } ?></p>
<ol id="linksdisp">
<li><a href="" title="" target="_blank"></a></li>
</ol>

Open Application panel and in the Server Behaviors section click + sign. From the list of options choose Recordset (Fig. 200).

Create Recordset image
Fig. 200

In the Recordset window type the following:

Name: rsLinks
Connection: conndb
Table: tbl_links
Columns: Selected ­ now select: linktitle, linkurl and linkdescr
Filter: linkapproved | = | Entered Value | y
Sort: linkdate | Ascending
(Fig. 201)

Recordset properties image
Fig. 201

Now click Advanced button.
In the new window we are going to slightly modify the sql statement using Dreamweaver built in features.
In Database items section expand tbl_categories table, select catname and press Select button on the right hand side (Fig. 202).
This will add catname to the sql statement.

Advanced recordset window image
Fig. 202

Now select linkcat in the tbl_links of the Database items section and press Where button on the right hand side (Fig. 203). This will add AND tbl_links.linkcat to the WHERE section of our SQL statement.

Advanced recordset window and where button image
Fig. 203

Now place your cursor after AND tbl_links.linkcat in the SQL section and type = sign.

Lastly select catid in the tbl_categories of the Database items section and click Where button again (Fig. 204). This will add tbl_categories.catid to the SQL statement.

Advanced recordset window and sql statement image
Fig. 204

Click OK and Save the file.

Go to the Code view and in the Application panel choose Bindings tab. In the code of the page identify the line which reads:

<li><a href="" title="" target="_blank"></a></li>

Place your cursor in between the quotes of the href and from the rsLinks recordset select linkurl. Now press the Bind button underneath (Fig. 205).

Bind dynamic field image
Fig. 205

Your href should now look like this:

href="<?php echo $row_rsLinks['linkurl']; ?>"

Now drag and drop linktitle from Bindings panel in between title′s quotation marks so it looks like this:

title="<?php echo $row_rsLinks['linktitle']; ?>"

Drag and drop linktitle again before the closing </a> tag so the whole link looks as follow:

<a href="<?php echo $row_rsLinks['linkurl']; ?>" title="<?php echo $row_rsLinks['linktitle']; ?>" target="_blank"><?php echo $row_rsLinks['linktitle']; ?></a>

Now place your cursor after the closing </a> tag and press Shift+Enter on your keyboard. This will create a <br /> tag, after which drag and drop linkdescr from the Bindings section of the Application panel (Fig. 206).

Code sample image
Fig. 206

Place your cursor right after the new, dynamic field and before the closing </li> tag and press Shift+Enter on your keyboard again to create another <br /> tag. After this type:

<span class="link"><?php echo basename($row_rsLinks['linkurl'], 'http://'); ?></span>

Now, before we move on, I would like to explain you what exactly is happening here. We are applying a css class around the dynamic field to format its content (url). Dynamic field will display the linkurl field of the relevant record from the database. The basename function uses two parameters: first ­ the source, second ­ the element which needs to be removed from source. This means that we will remove http:// from our linkurl field so it displays url starting from www. If source will not have http:// then the function will simply ignore it and display whatever there is in this field.

Place your cursor after closing </span> tag and press Shift+Enter on your keyboard again to create another <br /> tag. Now type:

<span class="linkcat">Category:</span>

Place your cursor after the word Category: and before the closing </span> tag. Now press spacebar on your keyboard and right after this drag and drop catname from the Bindings section of the Application panel. Select the newly added dynamic field:

<?php echo $row_rsLinks['catname']; ?>

and on your keyboard press Ctrl+B to wrap it with <strong></strong> tags.

Go to Design view and place your cursor anywhere within the section surrounded with <li></li> tags. Now press <li> tag on the status bar to select the entire section
(Fig. 207).

Select unordered list image
Fig. 207

Now from the Server Behaviors tab of the Application panel press + sign and from the list of options choose Repeat Region.

In the Repeat Region window choose our recordset rsLinks and type 20 in the Show section to indicate that we only want 20 records to be displayed on each page (Fig. 208). Click OK and Save the file.

Repeat region window image
Fig. 208

It there will be more than 20 records, users need to have an option to navigate through the pages. To allow this, we will create a recordset navigation bar. Dreamweaver has a build in tool to create recorset navigation bar which is located in the Data section of the Insert panel, however I will show you an easy way of creating the recordset navigation bar using just a few options from the Server Behaviors section of the Application panel.

Place your cursor after the closing </ol> tag and hit Enter on your keyboard twice to create two, new lines. Now copy and paste to following:

<p id="paging">First<span class="inactive">First</span>Previous<span class="inactive">Previous</span>Next<span class="inactive">Next</span>Last<span class="inactive">Last</span></p>

Change view to Design and select the first First word. In the Server Behaviors section of the Application panel click + sign. Now choose Recordset Paging > Move to First Page (Fig. 209).

Move to first page recordset paging image
Fig. 209

In the Move To First Page window choose our selection - First and recordset ­ rsLinks. Click OK to create link (Fig. 210).

Move to first page window image
Fig. 210

Now select the first Previous word and do the same, only this time choose Move To Previous Page (Fig. 211).

Move to previous page recordset paging image
Fig. 211

In the Move To Previous Page choose Previous selection and rsLinks recordset.

Select first Next word and do the same, this time choosing Move To Next Page. In the Move To Next Page window choose Next and rsLinks.

Finally select first Last word and for this one choose Move To Last Page. In the Move To Last Page window choose Last and rsLinks.

In Design view you should have now something what looks like in Fig. 212.

Recordset paging image
Fig. 212

Now select First link and in the Server Behaviors section of the Application panel click + sign. Choose Show Region > Show If Not First Page (Fig. 213).

Show region if not first page image
Fig. 213

In the Show If Not First Page window select rsLinks recordset and click OK (Fig. 214).

Show region if not first page window image
Fig. 214

Now select span with the second First word and this time choose Show If First Record. Select rsLinks and click OK.

Do the same with the remaining links and spans within our recordset navigation bar by assigning the following server behaviors every time choosing rsLinks as recordset:

Link Previous ­ Show If Not First Page
Span Previous ­ Show If First Page
Link Next ­ Show If Not Last Page
Span Next ­ Show If Last Page
Link Last ­ Show If Not Last Page
Span Last ­ Show If Last Page

Now go to Code view and identify the line which reads:

<p id="paging">

Place your cursor before this line and type the following:

<?php if ($totalRows_rsLinks > $maxRows_rsLinks) { ?>

Now find the closing </p> and type:

<?php } ?>

What this will do is it will make sure that the recordset navigation bar is only visible if the total number of records displayed on page will exceed the maximum which we have defined as 20.

Now select the content of the page from the line which reads:

<ol id="linksdisp">

down to (including) the line which reads:

</p>
<?php } ?>

With all this selected, go to the Server Behavior section of the Application panel, click + sign and from the list of options choose Show Region > Show If Recordset Is Not Empty (Fig. 215).

Show if recordset is not empty image
Fig. 215

In the Show If Recordset Is Not Empty window choose our rsLinks recordset and click OK (Fig. 216).

Show if recordset is not empty window image
Fig. 216

This server behaviour will hide the content if there aren′t any records available. To display message instead of empty space in case where there aren′t any records available, identify the line which reads:

<?php } // Show if recordset not empty ?>

Place your cursor at the end of this line and hit Enter on your keyboard to create a new line. On new line type the following:

<p>Sorry, there are no records available at present.</p>

Select the entire paragraph and from the Server Behavior of the Application panel choose Show Region > Show If Recordset Is Empty (Fig. 217).

Show if recordset is empty image
Fig. 217

Again choose our rsLinks recordset, click OK and Save the file (Fig. 218).

Show if recordset is empty window image
Fig. 218

Our page is now well formatted to display links, the only last thing we must do is to filter our result. To do this identify the line which reads:

mysql_select_db($database_conndb, $conndb);

Place your cursor at the end of this line and hit Enter on your keyboard twice to create two new lines. Now copy and paste the following:

if (isset($_GET['catid']) && $_GET['catid'] != "") {

$categ = $_GET['catid'];

$query_rsLinks = "SELECT tbl_links.linktitle, tbl_links.linkurl, tbl_links.linkdescr, tbl_categories.catname FROM tbl_links, tbl_categories WHERE tbl_links.linkcat=tbl_categories.catid AND tbl_links.linkapproved='y' AND tbl_links.linkcat = $categ ORDER BY tbl_links.linkdate ASC";

} else if (isset($_GET['keyword'])) {

$keyword = $_GET['keyword'];

$query_rsLinks = "SELECT tbl_links.linktitle, tbl_links.linkurl, tbl_links.linkdescr, tbl_categories.catname FROM tbl_links, tbl_categories WHERE tbl_links.linkcat=tbl_categories.catid AND tbl_links.linkapproved='y' AND (tbl_links.linkurl LIKE '%$keyword%' OR tbl_links.linktitle LIKE '%$keyword%' OR tbl_links.linkdescr LIKE '%$keyword%') ORDER BY tbl_links.linkdate ASC";

} else {

Now identify the line which reads:

$query_limit_rsLinks = sprintf("%s LIMIT %d, %d", $query_rsLinks, $startRow_rsLinks, $maxRows_rsLinks);

and before this line place the closing curly bracket like this:

}

That′s it there is to it ­ our page is finished.
There was quite a bit of coding therefore if you would like to compare your file with the one created in this chapter you can do it by downloading this file from here.

In the next section I will explain how to create Lastes Links page.

<<Search Engine | Latest Links Page>>

 

Website Design Company | Small Business Web Site Design | Ecommerce Web Site Design | Web Design Tutorials
UK Content Management System | Database Design | Flash Animation | Web Designer Resources | Independent Web Hosting Review
© Freelance Web Designer - Sebastian Sulinski | Valid CSS | Valid XHTML