I'm trying to create a post form for users where they can type something and add pictures in the middle of the text as well. I'm using tinyMCE + justboilme plugin to be able to use this. In justboilme I set the folder where all images will go. Next, from my post form I send contents to an ajax file and upload them to the server. Here's how it looks like:
HTML
<form method="post" action="" class="new_post">
<input type="text" id="post_title" name="post_title" placeholder="Title"><br /><br />
<textarea id="post_content" cols="40" rows="20"></textarea><br /><br />
<input type="submit" value="Submit" id="add_post">
</form>
JQUERY
$('.new_post').on('submit', function (submit)
{
var post_title = $('#post_title').val();
var post_content = $('#post_content').val();
$.ajax(
{
type: "POST",
url: "../ajax/ajaxPost.php",
data: {"title": post_title, "content": post_content},
success: function (post)
{
alert(post);
}
});
submit.preventDefault();
});
Ajax
session_start();
require("../Database/DB.php");
$id = $_SESSION['id'];
$username = $_SESSION['username'];
if($_POST) {
$title = $_POST['title'];
$content = $_POST['content'];
$add_post = mysqli_query($DB, "INSERT INTO posts (post_title, post_content, post_user_id, post_date) VALUES ('$title', '$content', '$id', now())");
if($add_post) {
echo "OK";
} else {
echo "Not ok";
}
}
Now, all of this works fine and I can see the images. However, every user who posts anything will upload his images to the same folder, which at some point will become clustered. Also I would like to have them organised nicely. Now all images go to this folder:
$config['img_path'] = '/posts';
I want to organise images for each user and each post i.e "/posts/username/postNo/img.jpg"
Any ideas how to deal with this? Or perhaps I should use another html editor or another way? If there is a better way/plugin to do this then please tell me. Cheers.