Image naming and retrieval

I am brand new to PHP and have a question.

I have a form that allows users to input data which is then added to the database. I am unsure when it comes to images though. I have an image upload in my form which works well. Images are submitted and stored on the server.

My problem is… I want to display the data stored in the database and here’s what I have so far…

    if(mysql_num_rows($result) != 0)   
  while($row = mysql_fetch_array($result)) 
    echo "<h2>" . $row['title'] . "<br /></b></h2>";
    echo "<p>" .$row['description'] . "<br /></p>";
    echo "<p><b>Step 1:</b> " .$row['step1'] . "<br /></p>";
    echo "<p><b>Step 2:</b> " .$row['step2'] . "<br /></p>";
    echo "<p><b>Step 3:</b> " .$row['step3'] . "<br /></p>";
    echo "<p><b>Step 4:</b> " .$row['step4'] . "<br /></p>";
    echo "<p><b>Step 5:</b> " .$row['step5'] . "<br /></p>";
    echo "<p><b>Step 6:</b> " .$row['step6'] . "<br /></p>";
    echo "<p><b>Step 7:</b> " .$row['step7'] . "<br /></p>";
    echo "<p><b>Step 8:</b> " .$row['step8'] . "<br /></p>";
    echo "<p><b>Step 9:</b> " .$row['step9'] . "<br /></p>";
    echo "<p><b>Step 10:</b> " .$row['step10'] . "<br /></p>";
    echo "<p><b>Category:</b> " .$row['maincat'] . "<br /></p>";

else {
    echo 'there are no results!'; 


The above code works fine but I also want to display images here. A user submits an image that is uploaded to a file on the server. I need to also create a record of the file name in the database so I am able to call the image for my display.

I hope this makes sense and if anyone could offer some advice I would be very very grateful.

Sounds easy enough - if you know what you are doing lol.

I have a form that allows users to submit text field and want to add my image upload to this form. Can the whole form (text fields and images uploads) all be submitted at once with the same submit button at the end or do images need to be uploaded on a separate submit button?

Here’s my main form…

<form action="../gallery/gallery-submit-scr.php" method="post">
<br />
		<br />
			<br />Give us a catchy title! Keep it shorty and sweet please. About as long as the box below if you can.

			<input type="text" size="75" name="title" />
	    <br />
		<br />
		<b>Description: </b> 
       		<br />Tell us about your project. Tell us a little or alot - it's up to you.

			<textarea rows="5" cols="50" name="description" /></textarea>
		<br />
		<br />
		<p><b>Optional - Step by step guide</b></p>
		<p>Teach others with your own step by step instructions. You can add up to 10 steps to your guide.</p>
		<br />	
			Step 1: <input type="text" name="step1" size="75" /><br />
			Step 2: <input type="text" name="step2" size="75"/><br />
			Step 3: <input type="text" name="step3" size="75"/><br />
			Step 4: <input type="text" name="step4" size="75"/><br />
			Step 5: <input type="text" name="step5" size="75"/><br />

			<input type="checkbox" name="checkbox" value="checkbox" onclick="ShowHide('hiddendiv1')"/>
			Add more steps if you want.
	    <div id="hiddendiv1" style="display:none">   
	    	Step 6: <input type="text" name="step6" size="75"/><br />
			Step 7: <input type="text" name="step7" size="75"/><br />
			Step 8: <input type="text" name="step8" size="75"/><br />
			Step 9: <input type="text" name="step9" size="75"/><br />
			Step 10: <input type="text" name="step10" size="75" /><br />	 

<br />
<br />

<p>Category:</b> <select name="maincat">
<option value="cardmaking">Choose category</option>
<option value="cardmaking">Card Making</option>
<option value="painting">Painting</option>
<option value="toymaking">Toy Making</option>
<option value="dont">Don't Know</option>

<br />	 
<br />
<br />
<input type="submit" value="add your project"/>

and the separate image upload form that I want to include…

<FORM ENCTYPE="multipart/form-data" ACTION="uploadck.php" METHOD=POST>
Upload this file: <INPUT NAME="file_up" TYPE="file">
<INPUT TYPE="submit" VALUE="Send File"></FORM>

And here’re the scripts for both…

gallery (title, description, step1, step2, step3, step4, step5, step6, step7, step8, step9, step10, image1, id, spare, maincat)
if (!mysql_query($sql,$con))
  die('Error: ' . mysql_error());
echo "1 record added";

echo $_FILES[file_up][name];
if ($_FILES[file_up][size]>250000){$msg=$msg."Your uploaded file size is more than 250KB so please reduce the file size and then upload. Visit the help page to know how to reduce the file size.<BR>";

if (!($_FILES[file_up][type] =="image/jpeg" OR $_FILES[file_up][type] =="image/gif")){$msg=$msg."Your uploaded file must be of JPG or GIF. Other file types are not allowed<BR>";

$add="uploaded_files/$file_name"; // the path with the file name where the file will be stored, upload is the directory name.

if(move_uploaded_file ($_FILES[file_up][tmp_name], $add)){
// do your coding here to give a thanks message or any other thing.
}else{echo "Failed to upload file Contact Site admin to fix the problem";}

}else{echo $msg;}

The ultimate goal is to add images to the server and create a record in the database with an image name which allows me to call the image with a URL.

Can anyone help me here? I am a complete noob.

Save the uploaded image to the server, record the name of the saved file in your database then use this field to build a URI pointing the location of this image for use as the src attribute for an img tag.