Bootstrap Datepicker with CodeIgniter

Navigation
1

Good night class,

I'm in a PHP project in CodeIgniter, where I'm already using Bootstrap and Morris.js (graphics). I need to implement the Datepicker now, and doing the same way it already worked in a test without CodeIgniter is not working. Can anyone give me a light? I already linked the css and the js, and nothing. Maybe I'm doing it wrong. Anyway, if anyone can help me, it follows the way I'm doing:

No head 

<!-- Bootstrap Core CSS -->
<link href="<?php echo base_url(); ?>assets/bootstrap/css/bootstrap.min.css" rel="stylesheet">

<!-- Custom CSS -->
<link href="<?php echo base_url(); ?>assets/bootstrap/css/sb-admin.css" rel="stylesheet">

    <!-- Bootstrap Datepicker -->
<link href="<?php echo base_url(); ?>assets/bootstrap/css/plugins/datepicker.css" rel="stylesheet">

<!-- Morris Charts CSS -->
<link href="<?php echo base_url(); ?>assets/bootstrap/css/plugins/morris.css" rel="stylesheet">

<!-- Custom Fonts -->
<link href="<?php echo base_url(); ?>assets/bootstrap/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

<!-- Latest compiled and minified JavaScript -->
    <script src="<? echo base_url(); ?>assets/bootstrap/js/bootstrap.min.js') ?>"></script>

    <!-- Bootstrap Datepicker JavaScript -->
    <script src="<? echo base_url(); ?>assets/bootstrap/js/plugins/datepicker/datepicker.js') ?>"></script>

No body 

<!-- jQuery -->
<script src="<?php echo base_url(); ?>assets/bootstrap/js/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="<?php echo base_url(); ?>assets/bootstrap/js/bootstrap.min.js"></script>

<!-- Morris Charts JavaScript -->
<script src="<?php echo base_url(); ?>assets/bootstrap/js/plugins/morris/raphael.min.js"></script>
<script src="<?php echo base_url(); ?>assets/bootstrap/js/plugins/morris/morris.min.js"></script>
<script src="<?php echo base_url(); ?>assets/bootstrap/js/plugins/morris/morris-data.js"></script>

<!-- Bootstrap Datepicker JavaScript -->
<script src="<?php echo base_url(); ?>assets/bootstrap/js/plugins/datepicker/datepicker.js"></script>
<script src="<?php echo base_url(); ?>assets/bootstrap/js/plugins/datepicker/datepicker-data.js"></script>

And this is datepicker-data.js 

$(function(){
        $('.datepicker').datepicker({
                autoclose: true,
        todayHighlight: true
        })
});

I called the form: 

<form>
                <div class="form-group">
                    <label for="data" class="control-label">Data:</label>
                        <div class="input-group">
                            <input type="text" class="form-control datepicker" id="data">
                            <div class="input-group-addon"><i class="fa fa-calendar"></i></div>
                        </div>
                </div>
                <div class="form-group">
                    <label for="turma" class="control-label">Turma:</label>
                    <select class="form-control">
                        <option>Turma 1</option>
                        <option>Turma 2</option>
                        <option>Turma 3</option>
                    </select>
                </div>
            </form>
    
asked by anonymous 07.07.2016 / 02:54

1 answer

0

Matheus, your code from the datepicker-data.js file is not functional, it replaces this section (commented so you understand the modifications) and please test, because I can not access your local includes to do so.

Follows: 

/* $(document).ready somente é executado quando a página está carregada, 
   do contrário o código javascript pode ser executado antes dos includes
   do jQuery e Datepicker. */
$(document).ready(function(){
    $('.datepicker').datepicker({
            autoclose: true,
    todayHighlight: true
    }); //faltava um ponto e vírgula aqui.
});

I hope I have helped.

    
07.07.2016 / 03:42
remove details preview of krajee avatar upload? footer hiding div with scrollbar when redimensioning the browser from top to bottom