blog sur le développement web, jquery,css3, Magento, Symphony, php et bien d'autres choses

Voici comment déclarer une fonction javascript et l’associer à un élément de formulaire Magento.

Par exemple nous avons une select box avec pour valeurs YES/NO. On veut que si c’est sur Yes (value = 1) on affiche un élément, si c’est sur No (Value = 0 ) on cache un élément.

On déclare donc notre selecbox:

$eventElem = $fieldset->addField('isAllowedFreight', 'select', array(
   'onchange'  => 'if($(\'isAllowedFreight\').value == 1) {
                     $(\'mon_element\').hide()
                  } else {
                     $(\'mon_element\').show()
                  }',
    'name'      => 'isAllowedFreight',
    'values'    => Mage::getModel('adminhtml/system_config_source_yesno')
                   ->toOptionArray(),
    'label'     => Mage::helper('amersalesorgmanager')
                         ->__('Allowed to ALL Freight Terms'),
    'value'     => $model->getAllowAllFreightTerms(),
    'required'  => true
));

Nous récupérons cet élément dans une variable $eventElem qui nous servira pour la suite. j’attire aussi votre attention sur le fait que,
il existe une propriété onclick et onchange du field qui vous permet de faire directement du javascript dans la value de ces propriétés.

Nous allons maintenant déclarer du code javascript et l’associer à la variable
$eventElem. il ne nous reste plus qu’a appeller la fonction setAfterElementHtml() puis ouvrir les balises javascript et écrire le code javascript qui vous va.

$eventElem->setAfterElementHtml(
       '<script>
          if($(\'isAllowedFreight\').value == 1 ) {
             $(\'mon_element\').hide();
        }

     // vous pouvez declarer des fonctions javascript
 // il faudra les appeler dans la value 'onclick' // de votre élément de formulaire

        </script>'
 );

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s