Vu le très peu de documentation que j’ai pu trouvé au sujet du plugin sfFormExtraPlugin de symfony, voici un guide rapide qui vous permettra d’installer le plugin sfFormExtraPlugin et pouvoir afficher un calendrier pour les champs de type date grâce au widget sfWidgetFormJQueryDate, voici donc les étapes à suivre:
1 – Installer le plugin sfFormExtraPlugin
En mode console, positionnez vous sur le dossier d’installation du projet et exécuter :
./symfony plugin:install sfFormExtraPlugin
2 – Télecharger et mettre en place les librairies jQuery nécessaire
Malheureusement le plugin sfFormExtraPlugin n’inclue pas les librairies externes nécessaire au fonctionnement, il faut le faire à la main!
il faut donc télécharger JQuery et JQuery UI:
- Allez sur le site de jQuery UI
- Dans la liste des composants déchochez toutes les cases sauf Core et Datepicker
- Sélectionner le thème qui vous convient à droite et cliquez Télécharger
3 – Placé les fichiers téléchargés dans le dossier web et modifier le fichier view.yml
Décompresser jquery-ui-1.8custom.zip et copier les fichiers décompresser vers le dossier web ainsi:
- js/jquery-1.4.2.min.js et js/jquery-ui-1.8.custom.min.js dans le dossier /web/js
- css/jquery-ui-1.8.custom.css dans le dossier /web/css
- renommer le dossier css/theme/images/ en jquery-ui-images et mettez le dans /web/images/
- Ouvrez le fichier /web/css/jquery-ui-1.8.custom.css et remplacer « images/ » par « ../images/jquery-ui-images/ » pour corriger le chemin vers les images
- calendar.png une petite icône qu’on affiche à coté du champs pour faire joli :p (à mettre dans /web/images/)
Maintenant il faut inclure les fichiers javascript et css dans view.yml de notre application (par exemple /apps/backend/config/view.yml) :
Ajout du fichier javascript
javascripts: [jquery-1.4.2.min.js, jquery-ui-1.8.custom.min.js]
Ajout du fichier css
stylesheets: [jquery-ui-1.8.custom.css]
4 – Mise en place du Widget dans la classe du formulaire
class PrescripteursForm extends BasePrescripteursForm
{
public function configure()
{
$this->widgetSchema['date_debut'] = new sfWidgetFormJQueryDate(array('image'=>'/images/calendar.png'));
$this->widgetSchema['date_fin'] = new sfWidgetFormJQueryDate(array('image'=>'/images/calendar.png'));
}
}
Et le tour est joué ;) ça devrai ressembler à ça :
Bonjour Mohammed et merci pour ce tuto.
Que faut-il modifier pour que le champ date soit en un seul bloc au lieu des 3 (jour, mois, année) ?
Merci d’avance,
Laurent
@Laurent, il faut rajouter le paramettre ‘date_input’ à la chaine d’initiation du widget sfWidgetFormJQueryDate, ça donnerai pour un formulaire « Foo »
class FooForm extends BaseFooForm
public function configure()
{
$dateWidget = new sfWidgetFormInputText();
$this->widgetSchema['date_input'] = new sfWidgetFormJQueryDate(array(‘image’=>’/images/calendar.png’, ‘date_widget’ => $dateWidget);
}
et voilà le tour est joué :)
Bonjour, comment fais-t’on pour mettre les mois en français?
Roseny : Pour avoir les mois en Français voici mon code :
$dateWidget = new sfWidgetFormI18nDate(array(
‘format’ => ‘%day%/%month%/%year%’,
‘month_format’ => ’short_name’,
‘culture’ => ‘fr’));
$this->widgetSchema['expirationdate'] = new sfWidgetFormJqueryDate(array(
‘image’ => ‘/images/calendar.png’,
‘culture’ => ‘fr’,
‘date_widget’ => $dateWidget));
J’ai aussi rajouté : uidatepicker-fr.js dans mon view.yml
Merci beaucoup ça m’a été très utile.
Une autre manière, pour gérer les mois en français et les selects dans le bon ordre :
http://tim.lepton.fr/blog/2010/09/14/utiliser-jquery-datepicker-dans-un-admin-symfony-en-francais/
Merci bcp
Even if I dont understant french your post was a great help!
Thanks
Comment installer le PEAR, car je n’arrive pas à installer le plugin sans le pear
Et comment étendre la plage des années ? Moi j’aimerais remonter jusqu’en 1930, mais par défaut je me vois limité entre 2006 et 2016
Je voudrais aussi savoir comment sélectionner l’heure
@Seth:pour installer le PEAR,il faut le faire avec la commande go-pear.bat inclut dans
le répertoire PHP de wamp
j’ai une question un peu bete,je suis débutante en symfony et j’ai cré un nouveau projet juste pour tester ce plugin sfFormExtraPlugin,alors j’ai fais toutes les instructions décrites ci dessus mais comment je peux voir l’apercu?quel chemin il faut mettre dans le navigateur pr le tester?
j’ai mis ceci: http://localhost/Projetest/web/frontend_dev.php mais on m’affiche la page d’accueil de symfony :(
svp pouvez vous m’aider? et merci d’avance
bonjour à tous,
j’ai suivi toutes ces étapes mais j’arrive pas à voir le calendrier pourtant les 2 champs de l’heure sont disparus et il me reste que les 3 champs de la date,voici mon code:
class UserForm extends BaseUserForm
{
public function configure()
{
$this->widgetSchema['created_at'] = new sfWidgetFormJQueryDate(array(‘image’=>’/images/calendar.png’));
$this->widgetSchema['updated_at'] = new sfWidgetFormJQueryDate(array(‘image’=>’/images/calendar.png’));
}
}
svp j’ai besoin de votre aide :(
@mona moon:Merci beaucoup pour le pear.
Une autre solution, on peut installer manuellement le plugin.
Sinon, je voudrais changer sfWidgetFormJQueryDate en input c’est à dire une seul champ de saisie mais pas 3 champs de saisie en utilisant toujours JQueryDate.
Merci.
est tu moh chrifi de paris8???
Non