intro
This article shows ajax auto completion with Zend_Form.
You can see the screens from the demonstration site.
You can see the screens from the demonstration site.
1.Create Controller
Create the file
application/constorllers/LocaleController.php
with the following content.
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 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
<?php require_once 'Zend/Controller/Action.php'; require_once 'Zend/Form.php'; require_once 'Zend/Locale.php'; class LocaleController extends Zend_Controller_Action { public function getForm() { $form = new Zend_Form(); $form->setName('localeForm') ->setAction($this->_request->getBaseUrl() . '/locale/index') ->setMethod('post'); $decorators = array( 'ViewHelper', array('HtmlTag', array('tag' => 'dt', 'class' => 'submit')) ); $element = $form->createElement('text', 'element'); $element->setLabel('Locale') ->setAttrib('dojoType', array('dijit.form.ComboBox')) ->setAttrib('store', 'localeStore') ->setAttrib('autoComplete', 'true') ->setAttrib('hasDownArrow', 'true') ->setRequired(true) ->addFilter('stringTrim') ->addValidator('stringLength', false, array(1,10)); $submit = $form->createElement('submit', 'submit'); $submit->setLabel('Send') ->setDecorators($decorators); $form->addElements(array( $element, $submit )); return $form; } public function indexAction() { $form = $this->getForm(); if ($this->getRequest()->isPost()) { if ($form->isValid($_POST)) { $values = $form->getValues(); $this->view->values = $values; } } $this->view->form = $form; } public function processAction() { $data = Zend_Locale::getLocaleList(); $this->_helper->autoCompleteDojo(array_keys($data)); } } |
2.Create View
Create the file
Specify the style class of body tag.
application/views/scripts/locale/index.phtml
with the following content.
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 27 28 29 30 31 32 33 34 35 36 37 |
<h1><?= $this->translate('Your Locale'); ?></h1> <?php if($this->values) : ?> <h3><?= $this->translate('You just submitted the following values'); ?>:</h3> <ul> <?php foreach ($this->values as $value) :?> <li> <?= $this->escape($value); ?> </li> <?php endforeach; ?> </ul> <?php else : ?> <?= $this->form; ?> <?php endif; ?> <style type="text/css"> @import "<?= $this->baseUrl ?>/js/dijit/themes/tundra/tundra.css"; @import "<?= $this->baseUrl ?>/js/dojo/resources/dojo.css"; </style> <script type="text/javascript"> var djConfig = { isDebug:true, parseOnLoad:true }; </script> <script type="text/javascript" src="<?= $this->baseUrl . '/js/dojo/dojo.js'?>"> </script> <script type="text/javascript"> dojo.require("dojo.parser"); dojo.require("dojox.data.QueryReadStore"); dojo.require("dijit.form.ComboBox"); dojo.require("dojo.data.ItemFileReadStore"); var localeStore = new dojo.data.ItemFileReadStore({ url:"<?=$this->url(array('action'=>'process'))?>" }); </script> |
Specify the style class of body tag.
1 |
<body class="tundra"> |
3.Check
Access the web server and check ajax auto completion for the element.
History
Date | Content |
---|---|
2008/4/29 | Published |
2008/4/29 | Added description about specifying the style class of body tag. |
This all seems a nice post and theory but what if this form itself is loaded by an ajax call? How to you inject the Javascript of the view in the page of the client and get it executed?
If you can use jquery, you can load a form html with the following code.
In your controller, please use ajaxcontext.
And create the file yourAction.ajax.phtml in your view script folder. It could be same with the above index.phtml file.