Tech Chorus

In the previous articles I've written about using Dojo date pickers and filteringSelect widgets.

When you use a JavaScript framework, library or toolkit in production, you would be interested in improving the performance of the application by:

• Reducing the footprint of the JavaScript code by compressing it, removing comments, white spaces, etc
• Reducing the number of HTTP requests, especially in Ajax applications
• Removing documentation, tests and other project files to be productive with FTP, SCP and VCS operations

Is the value of your Zend_Dojo_Form_Element_DateTextBox form element set to 11/30/1899?

We have all seen drop down date pickers in web pages that are really convenient for the user. Let us see how we can build one with just 2 lines of JavaScript code. Yes, you read it right. 2 lines of JavaScript. You don't even have to know JavaScript to build a date picker in your web page.

For the impatient: Demo is here

Before: Traditional HTML form with input field
Visit the above link and take a look at the HTML only form fields that collect date information from the user. If you don't use a server side scripting language to generate the form fields you have to type a lot of select options to make it easier for the user. Populating the select fields with the desired option, especially in the case of failed validation, takes a bit more server side code. Most of you would agree that the user hates these kind of forms.

Zend Framework users know that Dojo toolkit is integrated to 1.6+ release. In the previous post I demonstrated how to add a cool Dojo date picker widget to your text input form element by manually typing the JavaScript code. In this post let us discover how to create a cool date picker form element with Zend_Dojo. As the title says you don't have to write a single line of JavaScript. Zend_Dojo does all the work for you.

Prerequisite: you are familiar with Zend_Form, Zend_Controller and Zend_Layout.

Bootstrap: Zend Framework comes with many Dojo specific view helpers. You have to instruct the view object to find Dojo view helpers.

Grab the view object and add the following line in your bootstrap file.

Zend Framework brings lot of user interface goodies with Zend_Dojo family of classes. In this article let us explore how to build a form element with autocomplete feature.

As a prerequisite you must be familiar with

• Zend_Controller_Action
• Zend_Layout
• Zend_Form

Would it be nice if I tell you that you don't need any JavaScript knowledge? Zend_Dojo empowers PHP programmers to build dynamic and appealing forms without writing a single line of JavaScript.

This example has been tested with Zend Framework 1.7.0.

In this example, we will build a text element where the visitor can either select the user from the drop down list or type the username. While typing the username, the form element generates a drop down list filtering the data from user input. Take a look at the filteringSelect Dijit example to understand the type of form element we will be building.

FilteringSelect differs from Combobox Dojo widget in that, the value of the form element must be provided in the list. Also, you could display the username on the screen and set the 'user id' as the element value.

We will use the autoCompleteDojo action helper to send JSON data.

Let's start coding.