引导日期选择器不起作用laravel刀片 [英] bootstrap datepicker not working laravel blade
问题描述
我在引导日期选择器时遇到问题.我在这里阅读了很多问题，似乎我做对了所有事情.但是我仍然无法显示日期选择器.
i'm having a problem with bootstrap datepicker. I've read lots of questions here, and seemed like i did everything right. But still, i the datepicker wont show up.
这是app.blade.php的标题:
Here's my head section of app.blade.php:
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
<!-- Fonts -->
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css?family=Raleway:300,400,600" rel="stylesheet" type="text/css">
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css">
</head>
这是app.blade.php的我的脚本参考部分:
Here's my script reference part of the app.blade.php:
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-JmvOoLtYsmqlsWxa7mDSLMwa6dZ9rrIdtrrVYRnDRH0=" crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.min.js"></script>
<script>
$(document).ready(function() {
$('.datepicker').datepicker();
});
</script>
在这里我可以控制使用日期选择器的位置:
Here's where i control where i try to use the datepicker:
<div class="input-group">
<input type="text" class="form-control" data-provide="datepicker">
<div class="input-group-addon">
<span class="glyphicon glyphicon-th"></span>
</div>
</div>
推荐答案
如果要使用jQuery UI Datepicker，请按照以下步骤操作
Please follow below, if you want to use jQuery UI Datepicker
移动这一行代码
<script src="{{ asset('js/app.js') }}" defer></script>
从头到尾，它应该在您的布局文件(app.blade.php)
From head to bottom, it should look like as below in you layout file (app.blade.php)
<script src="{{ asset('js/app.js') }}"></script>
@yield('scripts')
</body>
</html>
在刀片文件中，使用以下代码.
In your blade file use the below code.
@section('scripts')
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( ".datepicker" ).datepicker({
changeMonth: true,
changeYear: true
});
});
</script>
@endsection
我希望您已经添加了一个带有"datepicker"类的输入框，因此单击该框将打开datepicker.我用过这个
I hop you already added a input box with class "datepicker", so that click on that will open datepicker. I have used this one
<input class="form-control datepicker" placeholder="Select Date" name="date" type="text">
对我有用，谢谢!!
这篇关于引导日期选择器不起作用laravel刀片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
