Saving file pathname to mySQL database using PHP - php

Question

Sorry if this question is really long winded but i want to be as detailed as i can in hope of getting an answer to my problem.
Basically i have a multipart form that i want to add file upload capabilities to. I have the form created, a function to handle saving the image to a directory and also a script to handle posting the form values to the database. My problem is that the i have the image storing where i want it to now on submit of the form but none of the form values are being sent to the database. I think my problem is that i am trying to store the new path name as a variable which i then call in the POST script but i think this is wrong?
The error that is thrown up is:
Notice: Undefined index: image in C:\xampp\htdocs\web_design_cms\create_wireframe.php on line 13
Here's the code for the form:
<form action="create_wireframe.php" method="post" enctype="multipart/form-data">
<!-- page_title -->
<p>
<label>Title:</label><br/>
<input type="text" class="text small" name="wireframe_title" id="wireframe_title" value="" />
<span class="note">*required</span>
</p>
<!-- page_meta_title -->
<p>
<label>Browser Title:</label><br/>
<input type="text" class="text small" name="browser_title" id="browser_title" value="" >
<span class="note">*required</span>
</p>
<!-- url_key -->
<p>
<label>Permanent Link:</label><br/>
<input type="text" class="text small" name="url_key" id="url_key" value=""/>
</p>
<!-- page_image -->
<div style="float:left" >
<!-- wireframe_type -->
<p>
<label>Type:</label><br/>
<select name="wireframe_type" id="wireframe_type" class="styled" style="width:240px">
<option value="design" > Design Draft</option>
<option value="wireframe" selected > Wireframe</option>
</select>
<span class="note">*required</span>
</p>
</div>
<div style="clear:both"></div>
<div class="message info"><p>
Allowed file types for upload: jpg,jpeg,gif,png.<br/>
Max file size: 10Mb<br/>
Picture size: 4096x4096 px
</p></div>
<p>
<label>Upload Image:</label><br/>
<input type="file" name="page_main_image" id="page_main_image" value="" />
</p>
<!-- page_bg_color -->
<p>
<label>Color:</label><br/>
<input type="text" class="text small" maxlength="6" size="6" style="width:60px" id="colorpickerField" name="page_bg_color" value="ffffff" />
<span id="colorSelector" style="background-color:#ffffff;padding:7px 10px;"> </span>
<span class="note">*required</span>
</p>
<p>
<input type="submit" class="submit small" value="Save" name="submit" />
</p>
</form>
Here's the php script 'create_wireframe.php' handling the form data:
<?php require_once("includes/db_connection.php"); ?>
<?php require_once("includes/functions.php"); ?>
<?php
if (isset($_POST['submit'])) {
//Process the form
$image = upload_file();
$wireframe_title = mysql_prep($_POST["wireframe_title"]);
$browser_title = $_POST["browser_title"];
$url_key = $_POST["url_key"];
$wireframe_type = $_POST["wireframe_type"];
$image = $_POST["page_main_image"];
$page_bg_color = $_POST ["page_bg_color"];
$query = "INSERT INTO wireframes (";
$query .= " wireframe_title, browser_title, url_key, wireframe_type, page_main_image, page_bg_color";
$query .= " ) VALUES (";
$query .= " '{$wireframe_title}', '{$browser_title}', '{$url_key}', '{$wireframe_type}', '{$image}', '{$page_bg_color}' ";
$query .= ")";
echo $query;
try { $result = mysqli_query($connection, $query);
} catch (Exception $e) {
return 'Caught exception: '+ $e->getMessage()+ "\n";
}
//Test if there was a query error
if ($result) {
//Success
// would normally use a redirect ie redirect_to("somepage.php");
//$message = "Subject created.";
redirect_to("wireframes.php");
}else {
//failure
//$message = "Subject creation failed.";
//redirect_to("add_project.php");
echo $query;
}
} else {
// This is probably a GET request
redirect_to("add_edit_wireframe.php");
}
?>
<?php
// Close database connection
if(isset($connection)){ mysqli_close($connection); }
?>
And finally the function i created for handling the storing of my images in the directory:
function upload_file(){
$allowedExts = array("gif", "jpeg", "jpg", "png");
$temp = explode(".", $_FILES["page_main_image"]["name"]);
$extension = end($temp);
if ((($_FILES["page_main_image"]["type"] == "image/gif")
|| ($_FILES["page_main_image"]["type"] == "image/jpeg")
|| ($_FILES["page_main_image"]["type"] == "image/jpg")
|| ($_FILES["page_main_image"]["type"] == "image/pjpeg")
|| ($_FILES["page_main_image"]["type"] == "image/x-png")
|| ($_FILES["page_main_image"]["type"] == "image/png"))
&& ($_FILES["page_main_image"]["size"] < 200000)
&& in_array($extension, $allowedExts))
{
if ($_FILES["page_main_image"]["error"] > 0) {
echo "Return Code: " . $_FILES["page_main_image"]["error"] . "<br>";;
}
else {
echo "Upload: " . $_FILES["page_main_image"]["name"] . "<br>";
echo "Type: " . $_FILES["page_main_image"]["type"] . "<br>";
echo "Size: " . ($_FILES["page_main_image"]["size"] / 1024) . " kb<br>";
if (file_exists("uploads/" . $_FILES["page_main_image"]["name"]))
{
echo $_FILES["page_main_image"]["name"] . " already exists. ";
}
else
{
move_uploaded_file($_FILES["page_main_image"]["tmp_name"],
"uploads/" . $_FILES["page_main_image"]["name"]);
echo "Stored in: " . "uploads/" . $_FILES["page_main_image"]["name"];
$image="{$_FILES['page_main_image']['name']}";
}
}
}
else {
echo "Invalid file";
}
return $image;
}
I'm not entirely sure but i think the problem is something to do with the variable $image that im trying to store the path name in? At the end of the function i return the variable and in the post script then try to take this value and post it into the 'page_main_image' field in the database but clearly i'm doing something wrong?
Sorry again for long post but any help you can give me will really be appreciated! Thanks

Answer 1

When dealing with uploaded files, such as images, you need to use $_FILES instead of $_POST to access the data.
Check out this documentation.
Edit
You need to change the main logic.
$image = upload_file(); //Good
$wireframe_title = mysql_prep($_POST["wireframe_title"]);
$browser_title = $_POST["browser_title"];
$url_key = $_POST["url_key"];
$wireframe_type = $_POST["wireframe_type"];
//Delete this, you're throwing out the value from upload_file()
$image = $_POST["page_main_image"];