Dreamweaver tutorials

• Link Exchange System with Dreamweaver CS3
• Edit Link Page

To create Edit Link page first open links_edit.php file from admin directory.
Go to the Code view and select the entire content by pressing Ctrl+A on your keyboard. Now hit Delete button to remove everything.

Now apply templates by going to Modify > Templates > Apply Template to Page from the Select Template window choose admin_temp and click Select. Save the file.

Go to the Code view and remove <p>Content Placeholder</p>.
Rename Title Placeholder to Edit Link and create a new line underneath (Fig. 111).

Go to Design view and create a new recordset by pressing + sign in the Server Behaviors tab of the Application pane.
In the new window type the following:
Name rsLink
for Connection choose conndb
select All for Columns
for Filter choose linkid then =, URL Parameter and type id in the last field.
Leave Sort as None and click OK to create a recordset (Fig. 112).

We also need to create a recordset to populate all available categories from the database.
Click + button in Server Behaviours and choose Recordset again.
This time fill it in as follow (Fig. 113):
Name rsCategories
Connection conndb
Table tbl_categories
Columns All
Filter None
Sort catname, Ascending

Click OK and save file.

Ensure that your cursor is under the Edit Link paragraph and from the Data tab of the Insert panel choose Record Update Form Wizard (Fig. 114).

In the new window choose the following:
Connection: conndb
Table to update: tbl_links
Select record from: rsLink
Unique key column: linkid
check the Numeric checkbox
After updating, go to: browse for links_updated.php.

In the Form fields select linkid and press - button at the top to remove this entry (Fig. 115). This is because we will not be updating this field manually. As you may recall from the section in which we build our database, we have set up linkid as Auto Increment which means this field will automatically get it's value which will be one higher than the last one in the database.
Scroll down and do the same with linkdate.

Now select linktitle and in the Label field type Link title: then press TAB (Fig. 116).

Do the same with the rest by giving them the following names:
linkurl URL:
linkrecip Reciprocal:
linkemail Email:
for linkapproved type Approved?:. From the Display as: dropdown menu choose Menu and click Menu Properties button.
In the new window select Manually for Populate menu items, in the Label field type Yes and for Value type y. Then click + button at the top and type No for Label and n for Value (Fig. 117).

Click OK.

For linkcat type Category:, from the Display as dropdown menu choose Menu and click Menu Properties button (Fig. 118).

Select From database radio button and choose:
Recordset rsCategories
Get labels from catname
Get values from catid
Leave the last field as default and click OK (Fig. 119).

For the last field linkdescr type Description: and from the Display as dropdown menu choose Text area (Fig. 120).

Now use the arrows in the top right corner to rearrange the order of the fields as follow:
Email
Category
Link title
URL
Reciprocal
Description
Approved? (Fig. 121)

Click OK to insert record update form.
Your page in Design view should now look like in Fig. 122.

Now we need to tidy up our table a little bit.
First place your cursor anywhere within the table and press the <table> tag selector in the bottom part of the window to select the entire table (Fig. 123).

With the table selected go to the Properties panel in the bottom part of the screen.
From the Table Id dropdown menu choose tblinsert, for Align choose Default and type 0 for CellPad, CellSpace and Border. Save the file (Fig. 124).

Select the Update record button and press Ctrl+T on your keyboard.
Move cursor after value="Update record" and type id="button" (Fig. 125).
Press Enter and save the file.

Place cursor in the first left cell in the top row and press Ctrl+T twice.
Replace td nowrap="nowrap" align="right" with th and press Enter twice.
Do the same with all cells in the left column (Fig. 126).

Go to the Code view and identify the line which says <th>Email:</th>.
Place your cursor after the <th> tag and type <label for="linkemail">. Now move your cursor after Link title: and on your keyboard press Shift+< then / - this will automatically place a closing </label> tag (Fig. 127).

As you can see I have assigned the same value to the for attribute as the name of the input field to which this label is referring.
Now we just need to add id="linkemail" to the input field (Fig. 128).

Now do the same with the remaining cells - assigning the relevant for labels and id's to the input fields.
Once you have done this the only last thing we will need to do is to apply some validation to the form fields.
To do this identify the line which says:

Place your cursor at the end of this line and press Enter to create a new line.
Now type or copy and paste the following:

Identify the line which says:

and place a closing curly bracket at the end:

Scroll down to the line:

Place your cursor at the end of this line and press Enter to create a new line.
Type <caption>Edit link</caption> and press Enter to create another new line.
Now type:

What this code does is it checks if variable $mess exists (it will only exist if any of the form fields to which validation applies were missing content) and if so then it will display an extra table row with the error message informing which fields needs to be filled in.

Also what you might do is to open links_updated.php page, apply template to it and change:

to:

Identify the line which reads:

and right after this, on the new line type:

Now it's time to test your page.
If everything works fine you can move to the next chapter where I will be expalining how to create an Add Link page.

<< Create Search Engine | Add Link Page >>