日期选择器不会在laravel中单击时显示日历

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了日期选择器不会在laravel中单击时显示日历相关的知识,希望对你有一定的参考价值。

我正在尝试使用日期选择器输入创建预订系统,但是单击时控件不显示日历。我已经将所有文件复制到矩阵中并将它们添加到我的项目中,但没有任何效果。

这是我用于添加资源的设计刀片代码

    <!DOCTYPE html>
     <html lang=" str_replace('_', '-', app()->getLocale()) ">
<head>
    <!-- CSRF Token -->
    <meta name="csrf-token" content=" csrf_token() ">
    <title>Booking | Client dashboard</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="asset('css/backend_css/bootstrap.min.css')" />
    <link rel="stylesheet" href="asset('css/backend_css/bootstrap-responsive.min.css')" />
    <link rel="stylesheet" href="asset('css/backend_css/datepicker.css')" />
    <link rel="stylesheet" href="asset('css/backend_css/uniform.css')" />
    <link rel="stylesheet" href="asset('css/backend_css/select2.css')" />
    <link rel="stylesheet" href="asset('css/backend_css/matrix-style.css')" />
    <link rel="stylesheet" href="asset('css/backend_css/matrix-media.css')" />
    <link rel="stylesheet" href="asset('css/backend_css/bootstrap-wysihtml5.css')" />
    <link href="asset('fonts/backend_fonts/css/font-awesome.css')" rel="stylesheet" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css"/>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,800' rel='stylesheet' type='text/css'>
    <script src="asset('js/backend_js/jquery.min.js')"></script>
</head>
<body>
    <!--Header part-->
    @include('layouts.clientLayout.client_header')
    <!--End Header part-->
    <!--Sidebar part-->
    @include('layouts.clientLayout.client_sidebar')
    <!--End Sidebar part-->
    <!--main-container-part-->
    @yield('content')
    <!--end-main-container-part-->
    <!--Footer part-->
    @include('layouts.clientLayout.client_footer')
    <!--End Footer part-->
    <!--Jquery-->

    <script src="asset('js/backend_js/jquery.ui.custom.js')"></script> 
    <script src="asset('js/backend_js/bootstrap.min.js')"></script> 
    <script src="asset('js/backend_js/bootstrap-datepicker.js')"></script>
   <script src="asset('js/backend_js/jquery.dataTables.min.js')"></script>
    <script src="asset('js/backend_js/masked.js')"></script> 
    <script src="asset('js/backend_js/jquery.uniform.js')"></script> 
    <script src="asset('js/backend_js/select2.min.js')"></script> 
    <script src="asset('js/backend_js/matrix.js')"></script> 
    <script src="asset('js/backend_js/wysihtml5-0.3.0.js')"></script> 
    <script src="asset('js/backend_js/jquery.peity.min.js')"></script> 
    <script src="asset('js/backend_js/bootstrap-wysihtml5.js')"></script> 
    <script type="text/javascript">$('.textarea_editor').wysihtml5();
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
    <script type="text/javascript">
     function goPage(newURL) 

// if url is empty, skip the menu dividers and reset the menu selection to default
if (newURL != "") 

    // if url is "-", it is this page -- reset the menu:
    if (newURL == "-") 
        resetMenu();
    
    // else, send page to designated URL            
    else 
        document.location.href = newURL;
    


    function resetMenu() 
document.gomenu.selector.selectedIndex = 2;
 
    </script>
</body>

这就是我创建datepicker输入的方式

       <div class="control-group">
                            <label class="control-label">Date picker (dd-mm)</label>
                            <div class="controls">
                                <input type="text" data-date="01-02-2013" data-date-format="dd-mm-yyyy" placeholder="01-02-2013" class="datepicker span11" style="width: 220px;">
                                <span class="help-block">Date with Formate of  (dd-mm-yy)</span> </div>
                        </div>

这是在包括设计刀片之后

    @extends('layouts.clientLayout.client_design')
    @section('content')

我可能做错了什么,因为这与我正在使用的模板文件中完成的方式几乎相同,除了它们都在一个文件中,在这里我将其分解

答案

你添加了datepicker初始化代码吗?

$('.datepicker').datepicker();

请检查datepicker的usage并将其取消

以上是关于日期选择器不会在laravel中单击时显示日历的主要内容,如果未能解决你的问题,请参考以下文章

在输入字段单击时显示 JQuery UI 日期选择器?

使用 Alpine 创建一个“始终打开的日期选择器”|活线

日期选择器仅在聚焦时显示错误

手机日历封面为啥不同时显示当天日期

Telerik rad 日期选择器在用户键入未来日期时显示错误消息

剑道日期选择器随机不显示日历以更改日期