Zend framework 1 article

Home >> Zend framework 1 >>

  Zend framework 1 CRUD operations part - 5

This article will explain you about the CRUD operations of Zend framework 1 in details include topics such as Zend form and Zend form with bootstrap classes.

Zend form
For our blog topic to be useful, we need a form for submitting new topic. Form can be created using zf create form command:

C:\wamp\www\zf1app>zf create form TopicForm
Creating a form at C:\wamp\www\zf1app/application/forms/TopicForm.php
Updating project profile 'C:\wamp\www\zf1app/.zfproject.xml'

This will create the directory application/forms/ with the class file TopicForm.php. Open that file and update it so it reads as follows:

class Application_Form_TopicForm extends Zend_Form
{

    public function init()
    {
        // Add an hidden id element, which will be used at edit time to pass primary key as hidden field.
        $this->addElement('hidden', 'id', array(
            'required' => false,
            'filters' => array('StringTrim')
        ));

        // Add an title element.
        $this->addElement('text', 'title', array(
            'label' => 'Your blog topic title:',
            'required' => true,
            'filters' => array('StringTrim')
        ));

        // Add the comment element.
        $this->addElement('textarea', 'description', array(
            'label' => 'Your blog topic description:',
            'required' => true,
            'rows' => 6,
            'column' => 5
        ));

        // Add CSRF protection.
        $this->addElement('hash', 'csrf', array(
            'ignore' => true,
        ));
    }

}

The above form defines four elements: a hidden id field, a title field, a description field and a CSRF protection token.

Note : hidden id field will be used when we update the blog topic and will pass id as hidden field.

Next, we will edit saveAction() method of our BlogController, which will process the form upon submission and found in application/controllers/BlogController.php, so it reads as follows:

/**
 * Save/Update blog topic.
 */
public function saveAction()
{
    $form = new Application_Form_TopicForm();

    // For meta title.
    $this->view->title = 'Add blog topic';
    $this->view->blogTopicForm = $form;
}

Next edit view file found in application/views/scripts/blog/save.phtml to render this form, so it reads as follows:    

// Add form action URL
$this->blogTopicForm->setAction($this->url());

// Add the submit button.
$this->blogTopicForm->addElement('submit', 'submit', array(
    'ignore' => true,
    'label' => 'Post Topic',
));

echo $this->blogTopicForm;

Note : Now, many people will have one question, why we have added form action URL and submit buttons in view instead of Application_Form_TopicForm class, because we can use same form at multiple place if needed, so button caption and action URL are easy to change.

Now browse to http://localhost/zf1app/public/blog/create you should see the following in your browser:

Note: If you see that above form on your browser, which does not seems good, we can make it good using bootstrap classes with Zend_Form decorators. It's not mandatory that you have to use only bootstrap, you can use your custom css or any other css framework with Zend_Form decorators or without Zend_Form decorators. Let's use Zend_Form with bootstrap class using decorators.

Zend_Form  with bootstrap class using decorators

Let's create one form once again. Form can be created using zf create form command:

C:\wamp\www\zf1app>zf create form TopicBootstrapForm
Creating a form at C:\wamp\www\zf1app/application/forms/TopicBootstrapForm.php
Updating project profile 'C:\wamp\www\zf1app/.zfproject.xml'

This will create the class file TopicBootstrapForm.php inside application/forms/directory. Open that file and update it so it reads as follows:

class Application_Form_TopicBootstrapForm extends Zend_Form
{

    public function init()
    {
        $this->setMethod('post'); // We can add method also, But by default zend use post method only.
        $this->setAttrib('class', 'form-horizontal'); // For Bootstrap Form
        $this->setAttrib('role', 'form'); // For Bootstrap Form
        
        //Add blog topic id element, which will be used at edit time to pass primary key as hidden field.
        $blog_id = new Zend_Form_Element_Hidden('id');
        $blog_id->setAttrib('class', 'form-control');
        $blog_id->setDecorators(
                $this->getBootstrapDecorator()
        );
        $this->addElement($blog_id);

        //Add an title element
        $title = new Zend_Form_Element_Text('title');
        $title->setAttrib('class', 'form-control');
        $title->setAttrib('placeholder', 'Your blog topic title');
        $title->setDecorators(
                $this->getBootstrapDecorator()
        );
        $title->setLabel('Title:');
        $title->setRequired(true);
        $this->addElement($title);

        //Add an description element
         $descripti Zend_Form_Element_Textarea('description');
        $description->setAttrib('class', 'form-control');
        $description->setAttrib('placeholder', 'Your blog topic description');
        $description->setAttrib('rows', 6);
        $description->setDecorators(
                $this->getBootstrapDecorator()
        );
        $description->setLabel('Description:');
        $description->setRequired(true);
        $this->addElement($description);

        // Add CSRF protection.
        $this->addElement('hash', 'csrf', array(
            'ignore' => true,
        ));
    }

    /**
     * Apply Bootstrap decorators to an element.
     * @return array
     */
    private function getBootstrapDecorator()
    {
        return array(
            'ViewHelper',
            'Description',
            'Errors',
            array(
                'Label',
                array(
                    'tag' => 'label',
                    'class' => 'control-label'
                )
            ),
            array(
                'HtmlTag',
                array(
                    'tag' => 'div',
                    'class' => 'form-group'
                )
            )
        );
    }

}

Next, we will edit saveAction() method of our BlogController once again, which will process the form upon submission and found in application/controllers/BlogController.php, so it reads as follows:

/**
 * Save/Update blog topic.
 */
public function saveAction()
{
    $form = new Application_Form_TopicBootstrapForm();

    // For meta title.
    $this->view->title = 'Add blog topic';
    $this->view->blogTopicForm = $form;
}

Next edit view file once again found in application/views/scripts/blog/save.phtml to render this form, so it reads as follows:

// Add form action URL
$this->blogTopicForm->setAction($this->url());

// Add the submit button
$this->blogTopicForm->addElement(
    'submit', 'Post Topic', array(
    'required' => false,
    'ignore' => true,
    'label' => 'Post Topic',
    'class' => 'btn btn-small btn-success'
        )
);

echo $this->blogTopicForm;

Now browse to http://localhost/zf1app/public/blog/create you should see the following in your browser, which is totally different from simple Zend_Form.

Write your comment now