CODEWITHSUNDEEP
phpjavascriptjqueryajax
Blaze Tama
Blaze Tama

Reputation: 10948

how to do $_POST for datepicker in php/codeigniter

First, I'm using the codeigniter framework and I'm a beginner in JS and AJAX, so please bear with me.

I read this question, so I tried to follow the answers.

This is the script (UPDATED):

 $(function() {
            $( "#datepicker").datepicker().click(function() {
            $.ajax({
                type: 'POST',
                url: "<?php echo base_url(); ?>backend/umat/add",
                dataType: "json",
                data: $('#form_daftar').serialize(),
                success: function(data) {
                    console.log("Done");

                }
            });
            return false;
            });
        });

And this is my datepicker HTML code:

<input type="text" id="datepicker" name="datepicker"
value="<?php echo isset($umat['tanggal_lahir'])?$umat['tanggal_lahir']:""?>"/>

My questions are (UPDATED):

  1. Is the URL I provided in AJAX above correct?
  2. How should I pass the data from AJAX to PHP (url: "<?php echo base_url(); ?>backend/umat/add")?

Thanks for your help :D

Upvotes: 1

Views: 2150

Answers (3)

Jai
Jai

Reputation: 74738

What you have missed here:

  1. your click event is outside of the doc ready handler, that should be inside doc ready so that when page gets ready the element should be available to click.
  2. You have missed a closing }); tag of the click event.(does not matter though)

so try this:

    $(function() {
        $( "#datepicker").datepicker();

        $("#datepicker").click(function() {
          $.ajax({
              type: 'POST',
              url: "<?php echo base_url(); ?>backend/umat/add",
              dataType: "json",
              data: {frmData : $('#form_daftar').serialize()}, // <----send this way
              success: function(data) {
                  console.log(data.date);
                  // here data is the returned data from the specified url and make sure
                  // that url is generating a proper json structrue.
                  // suppose there is a key named date which holds the submitted date so
                  // data.date will get you the date.
              }
           });
        }); //<----you missed this closing of click function.
    }); //<----------put everything before this closing of doc ready handler.

Although you can chain it too like this:

$(function(){
   $( "#datepicker").datepicker().click(function() {
       //......ajax function in click here
   });
});

See a demo here

Upvotes: 2

Binhvi
Binhvi

Reputation: 106

try it:

$(function() {
            $( "#datepicker").datepicker();         
            $("#datepicker").change(function() {
                $.ajax({
                    type: 'POST',
                    url: "<?php echo base_url(); ?>backend/umat/add",
                    dataType: "json",
                    data: $('#form_daftar').serialize(),
                    success: function(data) {
                        console.log("Done");

                    }
            });
        });

php get data form ajax:

<?php
$date = $_POST["datepicker"];
?>

Upvotes: 1

Gaurav Mehra
Gaurav Mehra

Reputation: 471

Another approach would be to use the datepicker inbuilt methods to trigger ajax request like

$('#datepicker').datepick({
      dateFormat:"yyyy-mm-dd",
      onSelect:function(){
          $.ajax({
             type: 'POST',
             url: "<?php echo site_url('backend/umat/add'); ?>",
             dataType: "json",
             data: $('#form_daftar').serialize(),
             success: function(data) {
                 console.log("Done");
             }
          });                                   
      }
});

Check the manual or inbuild functions and callbacks with your datepicker js.

Upvotes: 1

Related Questions