affichage d'un datetimepicker

**dananchet** · 09/05/2014, 14h21

Bonjour,
Je tente d'insérer un datetimepicker à partir de ce bundle:
http://knpbundles.com/stephanecollot...mepickerBundle
j'ai effectué l'installation du bundle sans soucis (avec le composer), ajouté mon champs date tel que suit:

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
// Form/EvenementType.php
$builder ->add('debut','collot_datetime', array( 'pickerOptions' =>
            array('format' => 'jj/mm/yyyy',
                'weekStart' => 1,
                'startDate' => date('jj/mm/yyyy', 0),
                'autoclose' => true,
                'startView' => 'month',
                'minView' => 'minute',
                'maxView' => 'decade',
                'todayBtn' => false,
                'todayHighlight' => false,
                'keyboardNavigation' => true,
                'language' => 'fr',
                'forceParse' => true,
                'minuteStep' => 5,
                'pickerReferer ' => 'default', //deprecated
                'pickerPosition' => 'bottom-right',
                'viewSelect' => 'hour',
                'showMeridian' => false,
                'initialDate' => date('jj/mm/yyyy'),
                )))

et dans mon template:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
{% block stylesheets %}
    {{ parent() }}
    <link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet" />
 
    {{ form_stylesheet(formA) }}
{% endblock %}
 
{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('js/jquery.min.jss') }}"></script>
    <script src="{{ asset('js/bootstrap.min.js') }}"></script>
 
    {{ form_javascript(formA) }}
{% endblock %}
 
 
{% block body %}
<div class="formAjout">
    <form method="post" {{ form_enctype(formA) }}>
        {{ form_rest(formA) }}
        {{ form_widget(formA) }}
        <input type = "submit" name = "ajouter" value = "Ajouter" class="btn:btn-primary"/>
    </form>
</div>
{% endblock %}

et à l'affichage j'obtiens un simple champs input sans rien de plus...
Quelqu'un aurait-il une idée s'il vous plait?

Merci

**_Thomas** · 09/05/2014, 22h48

Salut,

Je pense que c'est le copier/coller mais il manque une accolade à la fin de ton template (après le dernier endblock).

Ensuite, sur la ligne 11 de ton template, est-ce que c'est pas plutôt "jquery.min.js" et non "jquery.min.jss" ?

**dananchet** · 09/05/2014, 23h13

Alors merci, effectivement c'était bien .js et non pas .jss.
Malheureusement, ce la ne change pas le fait qu'il n'a pas l'air de trouver le fichier. Ni le bootstrap d'ailleurs.
En fait j'ai de nouveau téléchargé ces deux fichiers et les ai inclus dans mon bundle (public/js/) puis fais un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

 sudo php app/console assets:install web

Il cherche bien le bon fichier à présent, mais dans le code source, lorsque je clique sur le lien, j'obtiens l'erreur suivante;

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>An Error Occurred: Not Found</title>
    </head>
    <body>
        <h1>Oops! An Error Occurred</h1>
        <h2>The server returned a "404 Not Found".</h2>
 
        <div>
            Something is broken. Please e-mail us at [email] and let us know
            what you were doing when this error occurred. We will fix it as soon
            as possible. Sorry for any inconvenience caused.
        </div>
    </body>
</html>

Le code source généré au niveau de mon date time picker a l'air bon (mis à part le fait qu'il ne trouve pas les deux fichiers):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
   <script src="/js/jquery-ui.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
 
    <script type="text/javascript" src="/bundles/scdatetimepicker/js/bootstrap-datetimepicker.min.js" charset="UTF-8"></script><script type="text/javascript" src="/bundles/scdatetimepicker/js/locales/bootstrap-datetimepicker.fr.js" charset="UTF-8"></script><script type="text/javascript">
        jQuery(document).ready(function($) {
            $field = $('#bam_accueilbundle_evenement_debut');
 
 
 
                $field.datetimepicker({"format":"dd\/mm\/yyyy","weekStart":1,"startDate":"0101\/0101\/70707070","autoclose":true,"startView":"month","minView":"hour","maxView":"year","todayBtn":false,"todayHighlight":false,"keyboardNavigation":true,"language":"fr","forceParse":true,"minuteStep":5,"pickerPosition":"bottom-right"});  
 
                    });
    </script>