Last active
August 29, 2015 14:01
-
-
Save adammcarth/0896d3f0e5990501c52f to your computer and use it in GitHub Desktop.
Editing content with Aloha Editor and saving it to a database
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- target aloha editor to edit this div --> | |
<div class="editable_content"> | |
<!-- <?php echo $content_from_database ?> --> | |
<p>Hello, world!</p> | |
</div> | |
<!-- Edit away, and then users click this button to save their changes --> | |
<button class="update_content">Update Content</button> | |
<script src="http://code.jquery.com/jquery-git1.min.js"></script> | |
<script src="update_content.js"></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Create a script in PHP that looks for a $_POST[""] variable and saves it to a database. | |
// The technique used for this should be essentially the same as processing | |
// a contact form. Be aware that you'll need to handle updating database entries too. I'm not too sure | |
// about how that works in PHP - so again, see what you can dig up on the internet. | |
// | |
// example link to script: http://website.com/script.php |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// When the update button is clicked | |
$(".update_content").click(function() { | |
// Submit everything in the div to the php script | |
$.ajax({ | |
url: "/script.php", | |
type: "post", | |
data: { updated_content: $(".editable_content").html() }, | |
success: itSaved, | |
error: itFailed | |
}); | |
}); | |
// Shows the appropriate message before the editable_content div | |
function itSaved() { | |
$(".editable_content").prepend("Congratulations, the page was updated successfully."); | |
} | |
function itFailed() { | |
$(".editable_content").prepend("Oops. Something went wrong with the PHP script as the page was being saved."); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment