Zend Framework and JQuery: creating JQuery form in Zend

6 May

Sorry this blog is deprecated.

“Read new version of this article here.” http://zendgeek.blogspot.com/2009/07/creating-jquery-form-in-zend-framework.html

While few months back, I wrote an article on how to make Dojo Form in Zend Framework. Although dojo has numerous features, however most of the developers around prefer JQuery and prototype.

When Zend provide JQuery extension I wrote and article on how to use JQuery date picker.

While most of guys visited that article demand writing an article on how to create JQuery form in Zend Framework.

So  I’m here to show you how to use JQuery extension provide with latest version of Zend Framework for creating wonderful JQuery form.

You will need to follow the steps bellow to create JQuery form.

  1. Placing ZendX directory in right place
  2. Make necessary configuration in bootstrap file
  3. Write necessary code in your layout.phtml file.
  4. Create JQuery form
  5. and show that form in the template.

Placing ZendX directory in right place:

When you download latest version of Zend Framework and extract the zip file. You will see a directory called “extras”. When open that directory you will find ZendX folder. Copy this to your

Library/ folder at the same level of your Zend directory

You directory structure will be like this.

Library/

Zend/

ZendX/

Form show bellow will be displayed.

JQuery Form showing date picker

JQuery Form showing date picker

And the From will look like when first load

JQuery form when Date Selected

JQuery form when Date Selected

14 Responses to “Zend Framework and JQuery: creating JQuery form in Zend”

  1. Thang May 7, 2009 at 2:52 am #

    I follow your guide but it doesn’t work.
    It does not call the JS library in . Do you miss it?

  2. ED.Tsai May 7, 2009 at 8:29 am #

    Yes, I am too, it can’t find a library, I think the problem in bootstrap file or other configuration.

    Warning: Zend_Loader::include_once(ZendX\JQuery\Form.php) [zend-loader.include-once]: failed to open stream: No such file or directory in C:\AppServ\Zend\Loader.php on line 83

    Warning: Zend_Loader::include_once() [function.include]: Failed opening ‘ZendX\JQuery\Form.php’ for inclusion (include_path=’.;C:\AppServ;../application/default/models/;.;C:\php5\pear’) in C:\AppServ\Zend\Loader.php on line 83

    Fatal error: Class ‘ZendX_JQuery_Form’ not found in C:\AppServ\www\PHP\Zend_test\application\default\controllers\IndexController.php on line 26

  3. Faheem Abbas May 7, 2009 at 10:05 am #

    How can JQuery work if you miss adding js files. Please add necessary js files. like and jquery’s datepicker javascipt file and spinner.js file and css files as well.

  4. Faheem Abbas May 7, 2009 at 10:06 am #

    Make sure you have ZendX directory included in your directory path in proper place.

  5. ED.Tsai May 7, 2009 at 2:25 pm #

    Ok, It;s worked, but what’s jquery theme are you use? I can’t load
    image with base theme

  6. quantro May 8, 2009 at 6:08 am #

    Faheem, may i know the version of zend framework that u use here??
    i’m a newbie in zend….
    thanks,

    regard,
    quantro

  7. Faheem Abbas May 8, 2009 at 6:16 am #

    I’m using latest stable version.

  8. Faheem Abbas May 8, 2009 at 6:24 am #

    Read this one. here I’ve explained everything needed.
    https://zendguru.wordpress.com/2009/01/25/zend-framework-and-jquery-jquery-date-picker/

  9. quantro May 8, 2009 at 6:25 am #

    oh i see..
    that mean you use the 1.8.0 version, right??
    i there any different with the previous version??
    cause i use 1.7.8 version.

  10. quantro May 8, 2009 at 6:26 am #

    oh i see..
    that mean you use the 1.8.0 version, right??
    i there any different with the previous version??
    cause i use 1.7.8 version.

    regard,
    quantro

  11. quantro May 8, 2009 at 6:59 am #

    I mean :

    is there any different??

    regard,
    quantro

  12. ED.Tsai May 8, 2009 at 8:22 am #

    It’s worked, however I have a problem with css although i included it success on my web

    as this image
    http://yfrog.com/0ocapture46200710405am572j

  13. Joe Devon May 11, 2009 at 8:00 pm #

    I don’t think this example uses 1.8.0 because the bootstrap code uses the old format. Would be nice to see how the Bootstrap.php code should look in 1.8.0.

  14. Joe Devon May 11, 2009 at 11:01 pm #

    Funny, I got it to work but the file points to the wrong url on Google’s server🙂
    http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery-ui.min.js
    instead of
    http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js

    Hopefully Zend will fix it soon🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: