[Fixed]-JQuery – Foundation Datepicker on 'changeDate' trigger not behaving well

by

1👍

✅

You’re submitting the form at each page load by writing this :

$("#dp-form").submit();

You should call this in the ‘changeDate’ event handler : 

$('#dp').fdatepicker(format='yyyy-mm-dd')
        .on('changeDate', function(event) {
               var pickedDate = $("#dp").val();
               $("#dp-form").submit();
            });

If you want to send your form with ajax, you could use jQuery Form Plugin

<html> 


<script> 
    // wait for the DOM to be loaded 
    $(document).ready(function() { 
        $('#dp').fdatepicker(format='yyyy-mm-dd')
        .on('changeDate', function(event) {
               var pickedDate = $("#dp").val();
               $("#dp-form").submit();
            });
        // bind 'dp-form' and provide a simple callback function 
        $('#dp-form').ajaxForm(function() { 
            alert("Thank you for posting"); 
        }); 
    });
    //You'll also need this snippet in order to not struggle with csrftoken in Django :
    $(function() {
        function getCookie(name) {
            var cookieValue = null;
            if (document.cookie && document.cookie != '') {
                var cookies = document.cookie.split(';');
                for (var i = 0; i < cookies.length; i++) {
                    var cookie = jQuery.trim(cookies[i]);
                    // Does this cookie string begin with the name we want?
                    if (cookie.substring(0, name.length + 1) == (name + '=')) {
                        cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                        break;
                    }
                }
            }
            return cookieValue;
        }
        function csrfSafeMethod(method) {
            // these HTTP methods do not require CSRF protection
            return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
        }
        $.ajaxSetup({
            beforeSend: function(xhr, settings) {
                if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                    xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
                }
            }
        });
    });
</script>

👤Pierre Criulanscy

Leave a comment