Page 1 sur 1

Horloge en php

Posté : 20 juil. 2021, 00:06
par filou80
Bonsoir à tous,

Je me permet de venir vous demander votre aide.
Je travail sur un projet de fin d'année, en php css et un peu de js, j’essaie d'intégrer un input de type horloge mais impossible.
J'utilise bootstrap V5.0 comme framework.
Ma feuille CSS est bien reliée, mais cela ne fonctionne pas.
Voici le lien de l'horloge que je souhaite intégrer :

https://mdbootstrap.com/docs/b4/jque.../time-picker1/

En scrollant l'horloge que je souhaite intégrer est "now".
Je vous remercie par avance de votre aide.

@+ Filou

Re: Horloge en php

Posté : 20 juil. 2021, 08:04
par @rthur
mais cela ne fonctionne pas.
Il va falloir être plus précis et que tu avances davantage dans ton debugage pour nous indiquer à quel endroit ça ne marche pas et quels sont les messages d'erreur rencontrés que tu ne comprends pas.

Ton horloge est probablement en full javascript, donc il faut que tu regardes dans la console de développement de ton navigateur (Ctrl+Shift+k sous Firefox et probablement Chrome)

Re: Horloge en php

Posté : 20 juil. 2021, 09:38
par filou80
Bonjour,

Oui j’ai pas été très explicite.
J'ai recopier le HTML et le JS mais rien ne se passe, ma feuille JS est bien rattacher portant.
Merci par avance pour votre aide.

@+ Filou

Re: Horloge en php

Posté : 20 juil. 2021, 11:16
par ynx
Bonjour,

As-tu regardé si tu as des erreurs dans la console de développement comme suggéré par @rthur ?
Peux-tu nous montrer ton code stp ?

Bonne journée,

Re: Horloge en php

Posté : 20 juil. 2021, 11:37
par filou80
Voici mon php :
<!DOCTYPE html>
<html lang="fr">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Lien CSS Bootstrap V5 -->
<link href="/assets/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-wEmeIV1mKuiNpC+IOBjI7aAzPcEZeedi5yW5f2yOq55WWLwNGmvvx4Um1vskeMj0" crossorigin="anonymous">
<!-- Fin lien CSS Bootstrap V5 -->
<!-- Lien CSS Perso -->
<link rel="stylesheet" href="/assets/css/media.css">

<!-- Fin lien CSS Perso -->
<!-- Lien JS Perso -->

<!-- Fin lien JS Perso -->
<!-- Meta Perso -->
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<!-- Meta Perso -->
<title>vierge</title>
</head>

<body>

<div class="md-form">
<input type="text" id="manual-operations-input" class="form-control" placeholder="Now">
<label for="form1" class="">Check the minutes</label>
</div>




<!-- Script Bootstrap V5 -->
<script src="/assets/js/bootstrap.bundle.min.js" integrity="sha384-p34f1UUtsS3wqzfto5wAAmdvj+osOnFyQFpp4Ua3gs/ZVWx6oOypYoCJhGGScy+8" crossorigin="anonymous"></script>
<script src="/assets/js/jspersoludo.js"></script>
<!-- Fin script Bootstrap V5 -->
</body>

</html>
et voici mon js
var input = $('#manual-operations-input').pickatime({
autoclose: true,
'default': 'now'
});

// Manually toggle to the minutes view
$('#check-minutes').click(function(e){
e.stopPropagation();
input.pickatime('show').pickatime('toggleView', 'minutes');
});

Re: Horloge en php

Posté : 20 juil. 2021, 11:49
par Shadowwera
Salut,

tu ne répond toujours pas à la question :
As-tu regardé si tu as des erreurs dans la console de développement comme suggéré par @rthur ?

Re: Horloge en php

Posté : 20 juil. 2021, 12:45
par ynx
Concernant l'exemple de l'horloge précisé sur ton premier post, celui-ci utilise Bootstrap 4. Une nouvelle version de MDB utilisant Bootstrap 5 est disponible, il faudrait plutôt utiliser cette version si tu souhaites utiliser Bootstrap 5.

Il manque les fichiers css et js requis par MDB dans ta page : tu peux utiliser les CDN indiqués sur la page d'installation de MDB pour les ajouter facilement dans ton document html :
https://mdbootstrap.com/docs/standard/g ... ection-cdn

Néanmoins le composant MDB DatePicker que tu souhaites utiliser requiert MDB Pro Essential qui est une licence payante :
https://mdbootstrap.com/docs/standard/forms/datepicker/
https://mdbootstrap.com/docs/standard/pro/

Si tu ne veux pas payer pour ce composant, il faudra se tourner vers un autre script pour réaliser cette horloge.

Re: Horloge en php

Posté : 20 juil. 2021, 13:05
par filou80
Merci ynx,

Sauriez-vous si il existe quelque chose du même genre sans passer par une version pro ?

Merci au forum et à vous pour votre aide.
De se fait je vais le passer en résolu sans qu'il ne le sois vraiment.
Car j'avais vu dans le MDB la version pro payante, je pensé qu'il y avait moyen de contourner le probleme.

@+ Filou

Re: [RESOLU] Horloge en php

Posté : 20 juil. 2021, 13:46
par ynx
Je n'ai pas vraiment de script à recommander, en faisant une recherche je suis tombé sur ce composant : https://github.com/djibe/clockpicker
Exemple : https://jsfiddle.net/djibe89/9wj67d5u/
Il est indiqué qu'il fonctionne pour Bootstrap 3 et 4, mais il semble également fonctionner sans soucis avec Bootstrap 5.

Re: [RESOLU] Horloge en php

Posté : 20 juil. 2021, 15:55
par filou80
Ah cool merci je fait regarder cela de plus prés, je reveins vers vous prochainement.
Merci pour votre aide .
@+ Filou

Re: [RESOLU] Horloge en php

Posté : 23 juil. 2021, 16:35
par filou80
Bonjour à tous,
Je reviens, cela fonctionne.
Merci à tous pour votre aide.
@+ Filou