PD editor insert-image

This tutorial will show you how to add an image insert and pre-view feature in the PD on-line HTML editor.

It assumes that you have some basic knowledge of making a file upload page using the PureASP File Upload extension and making a list/menu dynamically.

First of all you need to make a upload page to get the images to the server and storing them in the database with a description and the filename (picture.jpg).

After this create a recordset within the PD on-line HTML editor page (NOT pd_edit.htm) for this image-upload table and select the description and filename.

Now you will have to find some place in the editor to insert the following:

• hiddenfield
• menu
• Add button
• new browser window
• Pre-view button

Something like this:

The hiddenfield:

This field will hold the path as value to the directory where you have uploaded your images. We will name this field 'prefix'.

example:

<input type="hidden" name="prefix" value="http://www.domain.com/Images/">

The dynamic menu:

Create a menu and call it 'imagebank'.

<select name="imagebank"> </select>

I had the problem that Ultradev didn't let me insert a dynamic list/menu within the HTML editor page (?), so i had to create a empty document and inserted the same recordset, a list/menu and then applied the dynamic menu. After this i copied/pasted the code from the page to the HTML editor page. This code is easy to find, it resides between the <select> </select> brackets of the list/menu.

So, create the dynamic list/menu and select the appropiate recordset and list/menu. Select get labels from the description field, get values from the filename field and select value equal to the filename field.