aftdev/jquery

This package is abandoned and no longer maintained. No replacement package was suggested.
There is no license information available for the latest version (1.0.0) of this package.

jQuery and jQuery UI helpers and form elements for Zend Framework 2 - based on snapshotpl/zf-snap-jquery

1.0.0 2016-04-26 19:48 UTC

README

jQuery and jQuery UI helpers and form elements for Zend Framework 2

Jquery Version 0.5.0 was Created by Witold Wasiczko

Features

Usage

Create form:

<?php

class Jquery extends \Zend\Form\Form
{
    public function init()
    {
        $this->add(array(
            'name' => 'slider',
            'type' => 'Slider',
        ));

        $this->add(array(
            'name' => 'spinner',
            'type' => 'Spinner',
        ));

        $this->add(array(
            'name' => 'datepicker',
            'type' => 'Datepicker',
        ));

        $this->add(array(
            'name' => 'autocomplete',
            'type' => 'Autocomplete',
            'attributes' => array(
                'jquery' => array(
                    'source' => array(
                        'Zend Framework',
                        'Symfony2',
                        'CakePHP',
                        'Kohana',
                        'Yii',
                    )
                )
            )
        ));

        $this->add(array(
            'name' => 'submit',
            'attributes' => array(
                'type'  => 'submit',
                'value' => 'Submit Jquery form!',
            ),
        ));
    }
}

Assign form to view in controller:

public function indexAction()
{
    $sl = $this->getServiceLocator();

    $form = $sl->get('FormElementManager')->get('\Application\Form\Jquery');

    return new ViewModel(array(
        'form' => $form,
    ));
}

and print it in view:

<?php echo $this->form()->openTag($this->form); ?>

<div class="form_element">
Slider:
<?php echo $this->formJquerySlider($this->form->get('slider')); ?>
</div>

<div class="form_element">
Spinner:
<?php echo $this->formJquerySpinner($this->form->get('spinner')); ?>
</div>

<div class="form_element">
Date picker:
<?php echo $this->formJqueryDatepicker($this->form->get('datepicker')); ?>
</div>

<div class="form_element">
Autocomplete:
<?php echo $this->formJqueryAutocomplete($this->form->get('autocomplete')); ?>
</div>

<div class="form_element">
<?php echo $this->formSubmit($this->form->get('submit')); ?>
</div>

<?php echo $this->form()->closeTag() ?>

That's it! Oh, and you need to print Zend's headLink(), headScript() and inlineScript() in your layout.

Customization

Custom jQuery UI element property

To change jquery options use jquery attribute:

$this->add(array(
    'name' => 'autocomplete',
    'type' => 'Autocomplete',
    'attributes' => array(
        'jquery' => array(
            'source' => 'data-source.php',
        ),
    ),
));

Custom version, theme or CDN

If you need to change version, theme or default CDN - overwrite configuration:

return array(
    'zf_snap_jquery' => array(
        'libraries' => array(
            'jquery' => array(
                'version' => '2.0.3',
                'cdnScript' => \Jquery\Libraries\Jquery::CDN_GOOGLE,
            ),
            'jquery-ui' => array(
                'version' => '1.10.0',
                'theme' => 'black-tie',
            ),
        ),
    ),
);

Custom scripts and styles

You can use your own script or style:

return array(
    'zf_snap_jquery' => array(
        'libraries' => array(
            'jquery' => array(
                'script' => 'url/to/script/jquery.min.js',
            ),
            'jquery-ui' => array(
                'script' => 'other/url/to/script/jquery-ui.min.js',
                'style' => 'url/to/style/jquery-ui.min.css',
            ),
        ),
    ),
);

Custom helper

If you don't want to use headLink(), headScript() and inlineScript() to include scripts and styles:

return array(
    'zf_snap_jquery' => array(
        'view-helpers' => array(
            'jquery' => array(
                'appendToOwnHelper' => false,
            ),
        ),
    ),
);

And then in your layout:

echo $this->jquery();

Custom way to append scripts or styles

To disable appending scripts and styles:

return array(
    'zf_snap_jquery' => array(
        'libraries' => array(
            'jquery' => array(
                'enable' => false,
            ),
            'jquery-ui' => array(
                'enable' => false,
            ),
        ),
    ),
);

To see what you can customize see source of module.config.php.

How to install?

Via composer.json

{
    "require": {
        "aftdev/jquery": "dev-master"
    }
}