Part1: What do I need to get started?
Since I am doing this locally on my machine For this to work you will need to have the software below installed. Also if you want to apply this to your live web site, your hosting company need to run PHP MYSQL
-
WAMP5 : http://www.wampserver.com/en/index.php
-
EMS SQL Manager for MySQL (WAMP5 comes with a sql manager, you can use it, or which ever one you are familiar with.
Download and install both software, if you installed wamp5, by default it would create a folder located in C:\wamp\www\, create two more folders inside the www\ directory called localroot and the other webroot.
Part2: Creating the database and tables.
Start up EMS and click on the create new database icon.
Create a new database with the name, pixeltest_db and click next, and you will see the window below.
Click next and Finish. When you do that you should see the Registration database window. Just click ok. We need to create the user to access the database click on the User Manager Icon . Change the Servers to Localhost and click ok. At this point click on the Add User Icon when you do that you will see the window below.
This is just a demonstration, so your username and password will be different. Make sure to select All Privileges and With Grant option. With that click ok to apply the settings.
Double click on the database you just created.
When you do that you will connect to the database where you will be able to see the tables.
With that click on the Create new table icon shown below.
With that it should send you into the Table Properties window. Click on the Fields tab.
Double click on the Column and enter the information shown below, below is how your table should look..

Table 1
With that click on Compile after your tables has finished compiling click on Data
Click on to Insert Record. Fill in the information shown below. The id is an auto increment so you don't need to do anything with that. After each data entry make sure to click on Post Edit
This is how your table should look, with the data entered. The image location will be different depending on where you place the images.

Well we are finished with the database part.
Part3: Setting up Dreamweaver.
Start up Dreamweaver and click New Site Manage Sites..
and click New Site. Click on the Advanced Tab and you will see the window below. Click on Local Info and fill in the information shown.
Local Info
Remote Info
Testing Server
When you are finished click ok, Done
Part4: Creating the index page, and connecting to the database.
Click File New... and click on Dynamic Page PHP and click Create. Hit Ctrl+S and save your site as index.php
Click on the Shown in the databases tab and click on MySQL Connection.
With that the window below will come up. Fill in the information shown below.
This information has to match up with what you created using EMS, The password I used is pixeldigest.
Next click on Select, select the pixeltest_db database and click ok twice.
At this point you will organize how you want to search result to be displayed. Click on Bindings and create a new Recordset by clicking on the . Create the Recordset according to the image.

Click on the (+) next Recordset, you will see the fields shown below.

Create the table shown below.

3 rows 3 column
Click and drag the names into the corresponding tables as shown below.

Click inside the blue table and select the table code shown below.

When you click on the table tag it will select your table. With the table selected click on Server behavior located in the Application window. From there click on the and select Repeat Region

When the window above comes up click on All Records. This is how many records you want to display at a time. If you have a large number of records you need to set a limit to display. Now hit F+12 to preview your work.
Finished:
Well that is it, hope it came out to what you expected. I also created a video tutorial for this example. The file is a 2.32 MB flash file. I have the link up on the video section on the forums. Users have to register to view the file, click here to register and view file. If you have any question or comment about this tutorial, feel free to post a message on the forum.
This Tutorial was Created By Mark
© 2007 pixeldigest.com. All Rights Reserved. |