I have tried all the combinations I can think off but this form:
class Form_Login Extends Zend_Form{
public function init(){
$this->setMethod('post');
$email = new Zend_Form_Element_Text('email');
$emailValidator = new Zend_Validate_EmailAddress();
$emailValidator->setMessage('Please use a valid email address');
$email->addValidator($emailValidator)
->setRequired(TRUE)
->setLabel("Email Address")
->setAttrib('size', '35');
$password = new Zend_Form_Element_Password('password');
$password->setLabel('Password')
->setAttrib('size', '35')
->setRequired(true);
$submit = new Zend_Form_Element_Submit('login');
$submit->setLabel('Login');
$this->addElements(array(
$email,
$password
)
);
$this->addDisplayGroup(array(
'email',
'password'
),'loginGroup',array('legend' => 'Login'));
$loginGroup = $this->getDisplayGroup('loginGroup');
$this->setElementDecorators(array(
'ViewHelper',
array('Label', array('separator' => '', 'requiredPrefix' => '* ')),
array('Errors'),
array('HtmlTag', array('tag' => 'p', 'class' => 'form-element')),
));
$loginGroup->setDecorators(
array(
'FormElements',
array('HtmlTag',array('tag'=>'div','openOnly'=>true)),
'Fieldset'
)
);
$this->addElements(array($submit));
//buttons do not need labels
$submit->setDecorators(array(
array('ViewHelper'),
array('HtmlTag', array('tag' => 'p', 'class' => 'submit-button'))
));
}
}
Displays fine in google chrome like the image below:
<fieldset id="fieldset-loginGroup"><legend>Login</legend>
<div>
<p class="form-element"><label for="email" class="required">* Email Address</label>
<input type="text" name="email" id="email" value="" size="35"></p>
<p class="form-element"><label for="password" class="required">* Password</label>
<input type="password" name="password" id="password" value="" size="35"></p>
<p class="submit-button">
<input type="submit" name="login" id="login" value="Login"></p></div>
</fieldset>
And in firefox it falls out of the fieldset tags so it looks like this:
<dl class="zend_form">
<fieldset id="fieldset-loginGroup"><legend>Login</legend>
<div>
<p class="form-element"><label for="email" class="required">* Email Address</label>
<input name="email" id="email" value="" size="35" type="text"></p>
<p class="form-element"><label for="password" class="required">* Password</label>
<input name="password" id="password" value="" size="35" type="password"></p></div>
</fieldset>
<p class="submit-button">
<input name="login" id="login" value="Login" type="submit"></p></dl>
I know the browser should not make much of a difference as the tags are generated server-side. I cannot however get the submit button to fall within the field set in firefox. I have not tried any other browser besides these two so I am not sure how it would look on them. Any help...?