Question

I have the following sample code, it works fine if I place foundation script before jQuery script, but if I place foundation script after jQuery, the calendar doesn’t show up.

Am I suppose to place foundation script (or other jQuery dependent scripts) before jQuery or after?

From foundation website, their samples suggest placing foundation scripts after jQuery script.

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/foundation/3.2.2/javascripts/foundation.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $('#datepicker').datepicker();
    });
</script>

<div id="datepicker"></div>

Answer 1

Following the thinking of this git issue, I notice that foundation.min.js includes jQuery (1.8.2, not not 1.8.3), and the two versions are probably conflicting. What happens if you just take out your separate jQuery?

If you absolutely need 1.8.3, I’d rebuild your foundation script to include it instead of 1.8.2