Zend framework form Decorators

i am trying to get the following layout using decorators:

    <form action="/index/login" method="post" id="login_form">            
        <div class="input_row">
            <img src="/images/user_icon.png" class="login_icon" alt=""/>                
            <label for="username" class="login_label">Username:</label>                
            <input type="text" name="username" value="" id="username" class="login_input"  />                            
        </div>
        <div class="input_row">
            <img src="/images/password_icon.png" class="login_icon" alt=""/> 
            <label for="password" class="login_label">Password:</label>                
            <input type="password" name="password" value="" id="password" class="login_input"  />                       
        </div>
        <div class="input_row">
            <input type="submit" name="login_submit" value="Login" class="login_submit"  />  
        </div>
    </form>

I have got this so far:

    $form = new Zend_Form;

    $form->setAction('/index/login')
         ->setMethod('post')
         ->setAttrib('id', 'login_form');

    $username = $form->creat开发者_开发百科eElement('text', 'username');
    $username->addValidator('alnum')
             ->setRequired(TRUE)
             ->setLabel('Username')
             ->setAttrib('class', 'login_input');


    $username->setDecorators(array(
            'ViewHelper',
            'Errors',
            array('Label',array('class' => 'login_label')),
            array('row' => 'HtmlTag'), array('tag' => 'div', 'class' => 'input_row')
        ));


    $form->addElement($username)
         ->addElement('submit', 'login', array('label' => 'Login'));           

How do i place the tag above the label?

Thanks!

I prepared an example that should be helpful in solving your problem. Here it is:

    $form = new Zend_Form;

    $form->removeDecorator('htmlTag');

    $form->setAction('/index/login')
            ->setMethod('post')
            ->setAttrib('id', 'login_form');

    $username = $form->createElement('text', 'username');

    $username->addValidator('alnum')
            ->setRequired(TRUE)
            ->setLabel('Username')
            ->setAttrib('class', 'login_input');


    // anonymous function that will generate your image tag
    $makeImg = function($content, $element, array $options) {
                return '<img src="/images/' . $options['img'] . '" class="' . $options['class'] . ' " alt=""/> ';
            };


    $username->setDecorators(array(
        'ViewHelper',
        'Errors',
        array('Label', array('class' => 'login_label')),
        array('Callback',
            array(
                'callback' => $makeImg,
                'img' => 'user_icon.png',
                'class' => 'login_icon',                    
                'placement' => 'PREPEND'
            )
        ),
        array('HtmlTag', array('tag' => null, 'class' => 'input_row')),
    ));

    $form->addElement($username);


    $submit = $form->createElement('submit', 'login', array(
                'label' => 'Login',
                'class' => 'login_submit'
                    )
    );


    $submit->setDecorators(array(
        'ViewHelper',
        'Errors',
        array('HtmlTag', array('tag' => null, 'class' => 'input_row')),
    ));

    $form->addElement($submit);

The form generates the following html (I did not generated password field as your Zend_Form code does not contain it):

 <form id="login_form" enctype="application/x-www-form-urlencoded" action="/index/login" method="post">
      <div class="input_row">
         <img src="/images/user_icon.png" class="login_icon " alt=""> 
         <label for="username" class="login_label required">Username</label>  
         <input type="text" name="username" id="username" value="" class="login_input">
      </div>
      <div class="input_row">
         <input type="submit" name="login" id="login" value="Login" class="login_submit"> 
      </div>
   </form>

What's worth mentioning is that I used Callback decorator. With this decorator you can call any function that can be used to inject custom html into your forms. In this example I made an anonymous function that I assigned to $makeImg variable (for this you need PHP 5.3 but in older versions of PHP you could do it also, but using e.g. create_function function). This $makeImg variable is my callback. As can be seen the function generates your img html tag.

Hope this will be helpful to you.

you can use form decorator

After add element set setDecorators here you can write HTML as you wan to show.

$this->addElements(array(  
           $id,
           $group_id,
           $content_name,
           $title, 
           $content,
           $tags,
           $status,
           $Publish
       ));

      $this->setDecorators(array(array('viewScript', array('viewScript' => 'admin/articleFormDecorator.phtml'))));

You could check out the AnyMarkup decorator:

http://www.zfsnippets.com/snippets/view/id/62/anymarkup-decorator