日期选择器和 Laravel 5答案

【问题标题】：Datepicker and Laravel 5日期选择器和 Laravel 5
【发布时间】：2016-02-19 06:11:06
【问题描述】：

我正在尝试用我的 laravel 项目实现 datepicker.js。我下载了 css/js 并将它们放在我的资产中并在应用程序模板中调用它们。然后我使用我的 Js 使用正确的 id 在我的表单上调用日期选择器，但没有任何内容出现，也没有错误。这是我所拥有的：

应用：

    <!doctype html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/assets/css/bootstrap-datepicker.min.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="/assets/css/gin_add.css">

    <title>Elephant Gin</title>

</head>
<body>





@yield('main')


<script src="/assets/js/jquery-2.1.1.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<script src="/assets/js/bootstrap-datepicker.min.js"></script>
<script src="/assets/js/gin_add.js"></script>
</body>
</html>

表单域：

{!! Form::text('date', null, array('type' => 'text', 'class' => 'form-control datepicker','placeholder' => 'Pick the date this task should be completed', 'id' => 'calendar')) !!}

Javascript：

    $('#calender').datepicker({
    format: "dd/mm/yyyy",
    forceParse: false
});

【问题讨论】：

什么时候调用datepicker函数？文件准备好了吗？还有你在控制台有什么错误吗？
文档准备就绪，没有错误。
您是否检查过文档本身是否存在来自服务器的可能缓存问题？
是的，我查看了网络以确保日期选择器 css/js 已加载。那里没有问题。引导日期选择器有替代品吗？也许是 laravel 原生的东西？
Laravel 本身不支持日期选择器

标签： javascript jquery twitter-bootstrap laravel datepicker

【解决方案1】：

我在 google 上搜索有关 Laravel 和 bootstrap-datepicker 的信息，发现 this link。答案之一是：

只是好奇。

您是否在 bootstrap-datepicker.js 之前安装了 jQuery？看起来 jQuery 是这个 bootstrap-datepicker.js 的依赖项

见：http://bootstrap-datepicker.readthedocs.org/en/release/

但是你写的好像不是你的情况

<script src="/assets/js/jquery-2.1.1.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<script src="/assets/js/bootstrap-datepicker.min.js"></script>
<script src="/assets/js/gin_add.js"></script>

但是，在我看来，它可能仍然与现有的 JQuery 日期选择器发生冲突......因此，您可以从 official documentation 中读取，您可以通过添加在 No conflict mode 中设置您的日期选择器

var datepicker = $.fn.datepicker.noConflict(); // return $.fn.datepicker to previously assigned value
$.fn.bootstrapDP = datepicker;                 // give $().bootstrapDP the bootstrap-datepicker functionality

【讨论】：