Javascript Demos Tutorials PHP & MySQL
For a recent project I needed to be able to edit text directly on the webpage I decided to use jeditable its very easy to implement and served my needs, but I also needed to add a Jquery UI calendar to the input once generated.
I tried a lot of different ways none of which worked until I came across a githup project called jeditable-datepicker
The default example works well:
$( document ).ready( function() {
var date = $( '.editable' );
date.editable(
function( value, settings ) {
date.html( value );
},
{
type: 'datepicker'
}
);
} );
It how ever does not demonstrate how to save the changes, with a little change saving the changes is easily done.
$(function() {
//editable
var date = $('.editable');
$('.editable').editable('save.php', {
indicator : 'Saving...',
tooltip : 'Click to edit...',
type: 'datepicker'
});
});
The changes are sent to save.php via a post. Inside the save file you collect the data then ideally save it, for this example I'm only formatting the data and showing the result back.
<?php
$value = $_POST['value'];
$id = $_POST['id'];
//format date
$value = date('jS M', strtotime($value));
//print the date
echo $value;
?>
Subscribe to my newsletter for the latest updates on my books and digital products.
Find posts, tutorials, and resources quickly.
Subscribe to my newsletter for the latest updates on my books and digital products.
