Zend FR

martinsupiot · 28-08-2009 14:22:00

Bonjour,

J'ai un bout de code super simple et pratique qui devrait servir à d'autres. Mon blog se prête pas trop à ce genre de tuto donc je le poste ici, mais éventuellement si l'un de vous à un blog technique sur le Zend Framework, ca vaudrait le coup de le partager.

Mon but était de valider mes champs de formulaire à la volée avec Jquery via Ajax. Cependant je ne souhaitais pas réécrire le paramétrage du formulaire en js. Le but est donc d'appeler un contrôleur ajax qui avec une méthode unique est capable d'instancier n'importe quel formulaire et de vérifier les valeurs passées en paramètre. Le message ou le code d'erreur éventuel est renvoyé en Json et affiché de la même manière qu'avec une validation classique du formulaire.

le contrôleur :

Code:

<?php
class AjaxController extends Zend_Controller_Action
{
    /**
     * Initialise le contrôleur
     * 
     * (non-PHPdoc)
     * @see Controller/Zend_Controller_Action#init()
     */
    public function init()
    {
        // Désactivation du layout
        $this->_helper->viewRenderer->setNoRender();
        $this->_helper->layout->disableLayout();
    }
    
    /**
     * Action ajax de test d'un champ de formulaire
     * 
     * @return Json object
     * 
     * Exemple de test : http://www.domain.fr/en/ajax/check-email/email/email@domain.fr
     */
    public function checkEmailAction()
    {
        // Initialisation des variables
        $data = array('errors' => array(), 'type' => '', 'messages' => array());
        
        // Récupération des paramètres
        $formData = $this->_request->getParams();
        
        // Test
        $form = new $formData['form'](false);
        $field = $form->getElement($formData['field']);
        $field->isValid($formData['value']);
        $data['errors']      = $field->getErrors();
        $data['type']        = 'errors';
        $messages            = $field->getMessages();
        $data['messages']    = $messages[current($data['errors'])];
        
        // Gestion d'un cas sans erreur !
        if(count($data['errors']) === 0) {
            $data['type']        = 'success';
            $data['messages']    = $this->view->translate('Ok');
        }
        
        // Encodage Json ou $json = $form->processAjax($data);
        $json = Zend_Json::encode($data);
        
        // Affichage du résultat
        echo $json;
        
        // Réinitialisation des variables
        unset($json);
        unset($data);
    }
}

le javascript à inclure dans tous les formulaires

Code:

function testFields(form, field) {
    
    if (field.value != this.lastValue) {
        
        // Initialisation du timer
        if (this.timer) {
            clearTimeout(this.timer);
        }
        
        this.timer = setTimeout(function () {
            
            // Ajout du loader
            $('#' + field.id).after('<img src="/img/ajax-loader.gif" height="16" width="16" />');
            
            // Requête ajax
            $.ajax({
                url: $('base').attr('href') + '/' + $('html').attr('lang') + '/ajax/check-form' + '/form/' + form.id + '/field/' + field.id + '/value/' + field.value + '/format/json',
                data: '',
                dataType: 'json',
                type: 'post',
                // Gestion si ok
                success: function (response) {
                response = response.data;
                    $('#' + field.id + '-element>img').remove();
                    $('#' + field.id + '-element>ul').remove();
                    if(response.messages != null) {
                        $('#' + field.id).after('<ul class="' + response.type + '" ajax"><li>' + response.messages + '</li></ul>');
                    }
                },
                // Gestion si ko
                error: function (msg, string) {
                    //alert(msg + ' : ' + string);
                    $('#' + field.id + '-element>img').remove();
                    $('#' + field.id + '-element>ul').remove();
                }
            });
        }, 200);
        
        this.lastValue = field.value;
    }
}

$(document).ready(function () {
    
    // Récupération des formulaires
    $('form').each(function() {
        var form = this;
        // Récupération des champs non cachés
        $('#' + form.id + ' input').each(function() {
            if((this.type != 'hidden') && (this.type != 'password') && (this.type != 'submit')) {
                $(this).keyup(function() {
                    testFields(form, this);
                });
            }
        });
    });
});

Attention, il ne faut pas oublier de donner au formulaire comme id, le nom de la classe formulaire casse comprise. Et pour en pas avoir de problème avec la validation des jetons, vous remarquez que mon action construit le formulaire avec un paramètre à false pour désactiver l'ajout du jeton.

Je suis preneur d'améliorations, si vous avez des idées sur le sujet.

Dernière modification par martinsupiot (26-09-2009 11:05:53)

Zend FR

#1 28-08-2009 14:22:00

[tuto][ZendX_JQuery][1.9]

Code:

Code:

Pied de page des forums