0

I'm trying to make it so that when my image is clicked, it opens a calendar and when the date is picked on the calendar, make it update my database with the new date using my AJAX method. *Just to note, my code does with with normal html text updatings in the database. I just need help with getting calendars to update the database using it.

My code is below :

HTML CODE

<td style="border: 1px solid #eee; text-align: center; font-size: 11px;" contenteditable="false" onBlur="saveToDatabase(this,'time','<?php echo $faq[$k]["id"]; ?>')" onClick="showEdit(this);">
<?php echo $faq[$k]["time"] != '' ? $faq[$k]["time"] : 'None'; ?>
<input type="hidden" id="datepicker">

AJAX CODE

        function showEdit(editableObj) {
            $(editableObj).css("background","#FFF");
        } 

        function saveToDatabase(editableObj,column,id) {
            $(editableObj).css("background","#FFF url('images/spin.gif') no-repeat right");
            $.ajax({
                url: "includes/saveedit_members.php",
                type: "POST",
                data:'column='+column+'&editval='+editableObj.innerHTML+'&id='+id,
                success: function(data){
                    window.location.replace("admin_members.php");
                }
           });
        }

JAVASCRIPT

    <script>
    $(function() {
        $("#datepicker").datepicker({
           showOn: 'button',
           buttonImage: 'http://theonlytutorials.com/demo/x_office_calendar.png',
           buttonImageOnly: true,
           changeMonth: true,
           changeYear: true,
           showAnim: 'slideDown',
           duration: 'fast',
           dateFormat: 'dd-mm-yy'
        });
    });
    </script>

PHP Receiving code

    if(!isset($_POST['column']) || !isset($_POST["editval"]) || !isset($_POST["id"])) {
    header('Location: error-pages/index.php');
} else if(isset($_POST['column']) && isset($_POST["editval"]) && isset($_POST["id"])) {
    mysqli_query($con, "UPDATE users set " . $_POST["column"] . " = '".$_POST["editval"]."' WHERE  id=".$_POST["id"]);
}

Remember, I'm just needing help making it so it updates my database when my desired date is clicked.

An example image of what it looks like :

When i click the calendar image

1 Answers1

0

If you need to update the database when you select a date in the calendar, you can use the onSelect event, wich call a function when a date is selected.

See the datepicker documentation or you can see this question where they talk about this event.

Community
  • 1
  • 1
  • Could I make it like this ? `">`. For this way, I would want to make it get the value of the users id for each row and get the value of the datetime ? How would I actually get the value of the date in ajax / javascript ? – BenZa Music Dec 10 '16 at 22:36
  • No, if you use an hidden element you cant see it, so you cant clik it. – Fernando Popoca Ortiz Dec 10 '16 at 22:41
  • So how can i do it like that ? – BenZa Music Dec 10 '16 at 22:43
  • You have to use a visible input and bind the datepicker plugin, then you have to use the onSelect event to make an action when a date is selected. Thats what i do in this [fiddle](http://jsfiddle.net/wn64gL0q/) – Fernando Popoca Ortiz Dec 10 '16 at 22:50
  • I don't want to create a visible textbox. I want it to be hidden but still get the value. https://gyazo.com/9de3b533e152095a944ed084c1b7f65b – BenZa Music Dec 10 '16 at 22:55