I am using Aloha Editor and loving it.
I am stuck with saving data from different divs on the page to database.
I found a tutorial called contentEditable at: http://gazpo.com/2011/09/contenteditable/
It saves 1 div to database, however I have multiple divs on my web page and I can't work out the logics.
I would really appreciate if you could help?
I have the following php/Javascript/Ajax on my index.php:
<?php
//get data from database.
include("db.php");
?>
<script>
$(document).ready(function() {
$("#save").click(function (e) {
var content = $('[class^="editable"]').html();
$.ajax({
url: 'save.php',
type: 'POST',
data: {
content: content
},
success:function (data) {
if (data == '1')
{
$("#status")
.addClass("success")
.html("Data saved successfully")
.fadeIn('fast')
.delay(3000)
.fadeOut('slow');
}
else
{
$("#status")
.addClass("error")
.html("An error occured, the data could not be saved")
.fadeIn('fast')
.delay(3000)
.fadeOut('slow');
}
}
});
});
$('[class^="editable"]').click(function (e) {
$("#save").show();
e.stopPropagation();
});
$(document).click(function() {
$("#save").hide();
});
});
</script>
On my index.php, each divs with a unique class, for instance .editable1 and inside the div I have the following PHP to echo the data from database:
<div class="editable1">
<?php
$sql = mysql_query("select text from content where element_id='1'");
$row = mysql_fetch_array($sql);
echo $row['text'];
?>
</div>
<div class="editable2">
<?php
$sql = mysql_query("select text from content where element_id='2'");
$row = mysql_fetch_array($sql);
echo $row['text'];
?>
</div>
My save.php I have:
<?php
include("db.php");
$content = $_POST['content']; //get posted data
$content = mysql_real_escape_string($content); //escape string
$sql = "UPDATE content SET text = '$content' WHERE element_id = '1' ";
$sql = "UPDATE content SET text = '$content' WHERE element_id = '2' ";
if (mysql_query($sql))
{
echo 1;
}
?>
My db.php:
<?php
//database connection
mysql_connect("localhost", "root", "root") or die(mysql_error());
mysql_select_db("create") or die(mysql_error());
?>
The issue is that when I update text with Aloha editor in the div.editable1 it says "saved successfully" but when I refresh the page the divs are empty and database rows are also empty.
Any help would be very much appreciated :)
Thanks, Michel