zend form element add div after input field - zend-framework

my zend form generates following code:
<dt id="register_username-label">
<label for="register_username" class="required">Membername*</label>
</dt>
<dd id="register_username-element">
<input type="text" name="register_username" id="register_username" value="" />
</dd>
but in some cases (handled in a separete decorator) i need to add some more html next to the input field (also in the dd tag). i have a instance of Zend_Form_Element_Text witch i could add some more decorators, but i don't know how to get this done :(
solution should look like this:
<dt id="register_username-label">
<label for="register_username" class="required">Membername*</label>
</dt>
<dd id="register_username-element">
<input type="text" name="register_username" id="register_username" value="" />
<div class="validate"><div class="validate-check"></div></div>
</dd>

You can add decorators to your form element in form file just as below
$form->addElement(
'text',
'register_username',
array(
'required' => false,
'decorators' => array(
array(
'HtmlTag', array(
'tag' => 'div',
'class' => 'validate'
)
)
)
)
);
And more i would like to share with you one interesting Link to understand how zend form is basically works.
Please let me know if i can help you more.

Related

TYPO3 Indexed Search Url on submit

i use TYPO3 7.6.10
i use indexed_search 7.6.0
when i submit form i go to the target page and i get the results.
The url of target page is:
search.html?tx_indexedsearch_pi2%5Baction%5D=search&tx_indexedsearch_pi2%5Bcontroller%5D=Search
i want to remove action and controller variable form url to get:
search.html
i can do that adding a configuration to real url like this:
'searchConfiguration' => array(
array(
'GETvar' => 'tx_indexedsearch_pi2[action]',
'valueMap' => array(),
'noMatch' => 'bypass'
),
array(
'GETvar' => 'tx_indexedsearch_pi2[controller]',
'valueMap' => array(),
'noMatch' => 'bypass'
)),'135' => 'searchConfiguration'
Now i get a nice url but the submitted data is not sent!
How can i resolve it?
Those parameters are required for the controller to be routed by the request. Without them the sWord will not become processed by the controller and you will not get any results.
Instead of bypassing them you can rewrite them to get something like /search/perform/results/ or you can configure your form to use method="POST" instead of "GET" and add those parameters above into hidden fields of the form and make sure the form attribute does not have the arguments as parameters in the action. Example form in the result:
<form method="POST" class="header-search-form hidden-xs hidden-sm" action="suche.html">
<input type="hidden" name="tx_indexedsearch_pi2[controller]" value="Search">
<input type="hidden" name="tx_indexedsearch_pi2[action]" value="search">
<div class="input-group">
<input type="text" class="search-query form-control" placeholder="Suchen" id="default-search-input" name="tx_indexedsearch_pi2[search][sword]">
<span class="input-group-btn">
<button class="btn" type="button">
<i class="fa fa-search" aria-hidden="true"></i>
</button>
</span>
</div>
</form>

Zend Form Rendering and Decorators (Use correctly with bootstrap)

The Bootstrap Example Code
http://getbootstrap.com/css/#forms
Copying a simple email input element from getbootstrap.com suggests we format the HTML in the following way:
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input id="exampleInputEmail1" class="form-control" type="email" placeholder="Email">
</div>
Above we have a <label> tag that closes straight after it's text content, "Email address".
I would now like to create the same form group using Zend Framework.
module/MyApp/src/MyModule/Form/MyForm.php
namespace MyModule\Form;
use Zend\Form\Form;
class MyModuleForm extends Form {
public function __construct($name = null)
{
$this->add(array(
'name' => 'email_address',
'type' => 'Email',
'options' => array(
'label' => 'Email address',
),
'attributes' => array(
'class' => 'form-control',
'placeholder' => 'Email'
)
));
The Zend Framework generated code
<div class="form-group">
<label>
<span>Email address</span>
<input class="form-control" type="email" placeholder="Email" id="exampleInputEmail1">
</label>
</div>
In the above HTML you can see that Zend has not closed the <label> tag. Instead the <label> ecapsulates its children.
How do I change the way the Zend rendering works?
I assume you are using ZF2 FormRow view helper to render your form element in your view script, e.g. $this->formRow($this->form->get('email_address'));
To render it differently you need to use the following view helpers
FormLabel
FormText
FormElementErrors
If for example you wanted to render as a definition list you would use something like
<dl class="zend_form">
<dt><?php echo $this->formLabel($this->form->get('email_address')); ?></dt>
<dd><?php echo $this->formText($this->form->get('email_address')); ?>
<?php echo $this->formElementErrors($this->form->get('email_address')); ?></dd>
</dl>
I hope this points you in the right direction

can we apply class to checkbox input instedad of container div in cakephp

Here the code for checkbox generation
//code
echo $this->Form->select('Model.field', $options, array(
'multiple' => 'checkbox','div'=>'col-md-9',
'class' => 'required'
));
//output
<div class="required" aria-required="true">
<input type="checkbox" id="FormData6783" value="83" name="data[Model][field][]">
<label for="FormData6783">Sr. Secondary</label>
</div>
<div class="required" aria-required="true">
<input type="checkbox" id="FormData6783" value="83" name="data[Model][field][]">
<label for="FormData6783">Secondary</label>
</div>
it applies class to container div instead of input.. Is there any way to apply class to input ?
You will have to extend the FormHelper with your own helper and then overload the select method to change the code that generates the select. Check the BoostCake plugin to get an idea of one way o changing FormHelpers output.
You can then alias the helper to replace it app wide:
public $helpers = ['Form' => ['className' => 'MyForm']];

Styling individual radio buttons in drupal form

I have this group of radio buttons in which each of individual button has of its own position set through style attribute. I would like to how can I archive the same by using drupal form api. I found how to style as whole but, not as individual control within group. Here's how my html code look like -
<input type="radio" name="base_location" checked="checked" value="0" style="margin-left:70px;float:left;"/><span style="float:left;">District</span>
<input type="radio" name="base_location" value="1" style="margin-left:50px;float:left;"/><span style="float:left;">MRT</span>
<input type="radio" name="base_location" value="2" style="margin-left:60px;float:left;"/><span style="float:left;">Address</span>
And this is the drupal code I'm stuck at -
$form['base_location'] = array(
'#type' => 'radios',
'#title' => t('base location'),
'#default_value' => variable_get('search_type', 0),
'#options' => array(
'0'=>t('District'),
'1'=>t('MRT'),
'2'=>t('Address')),
'#description' => t('base location'),
I'm aware of #type=>radio existence. However, I do not know how to group all my radio buttons together in this regard. If I use same array key for all of them, they would collide each other. If I don't, they aren't seen as part of the same group. I thank you in advance.
If you're using Drupal 6.x Form API and #type=>radios (http://api.drupal.org/api/function/theme_radios/6) each radio element will have its unique id which you can use to apply proper CSS.
The example you provided
$form['base_location'] = array(
'#type' => 'radios',
'#title' => t('base location'),
'#default_value' => variable_get('search_type', 0),
'#options' => array(
'0'=>t('District'),
'1'=>t('MRT'),
'2'=>t('Address')),
'#description' => t('base location'),
);
should output markup like so:
<div id="base-location-0-wrapper" class="form-item">
<label for="base-location-0" class="option"><input type="radio" class="form-radio" value="0" name="base_location" id="base-location-0"> District</label>
</div>
<div id="base-location-1-wrapper" class="form-item">
<label for="base-location-1" class="option"><input type="radio" class="form-radio" value="1" name="base_location" id="base-location-1"> MRT</label>
</div>
<div id="base-location-2-wrapper" class="form-item">
<label for="base-location-2" class="option"><input type="radio" class="form-radio" value="2" name="base_location" id="base-location-2"> Address</label>
</div>
Apply the following CSS and you should be set.
#base-location-0-wrapper,
#base-location-1-wrapper,
#base-location-2-wrapper {
display:inline;
margin-left:50px;
}
The answer is to use CSS with the html that you already have. It looks like you just want to change the radio buttons' display to 'inline' with 10px margins, which you can do. (And if you did break the radios up into separate elements within a fieldset, they'd no longer interact with each other.)

How to change the layout of a form with Zend_Form decorators?

I'm totally confused about how decorators work. This is the html structure that I'm trying to achieve:
<form id="" action="" method="post">
<fieldset><legend>Contact form</legend>
<p>
<label for="name">Name</label>
<input type="text" name="name" id="name" size="30" />
</p>
<p>
<label for="email">Email</label>
<input type="text" name="email" id="email" size="30" />
</p>
<p>
<label for="web">Website</label>
<input type="text" name="web" id="web" size="30" />
</p>
<p>
<label for="message">Message</label>
<textarea name="message" id="message" cols="30" rows="10"></textarea>
</p>
<p class="submit"><button type="submit">Send</button></p>
</fieldset>
</form>
How do I get rid of the definition list format and use a paragraph tag based layout instead?
Update: Is there a way for me to apply this style to all the forms I have created? instead of having to apply the decorators to each and every form?
If you want to change the elements of your form you have to reset the Decorators of your Form and it's elements.
Example of enclosing a field in a p-tag
class Default_Form_Contact extends Zend_Form
{
public function init()
{
$name = new Zend_Form_Element_Text('name');
$name->setLabel('Name:')
->setDecorators(
array(
array('ViewHelper', array('helper' => 'formText')),
'Errors',
array('Description', array('tag' => 'p', 'class' => 'description')),
array('HtmlTag', array('tag' => 'p', 'id' => 'name-element')),
array('Label', array('class' => 'label')),
)
);
$this->addElement($name);
}
}
Which decorators you really need you have to consider yourself. For the form decorators you can do in the init()
$this->setDecorators(array(some decorators));
After a while, I just gave up and used just the ViewRenderer decorator. Here is a good post explaining how to do that (http://weierophinney.net/matthew/archives/215-Rendering-Zend_Form-decorators-individually.html). The rest of that series is good as well if you really want to know how to use decorators.
With the ViewRenderer decorator, you're basically rendering your form against a template (not unlike MVC itself). This way gives you the ultimate control over everything, but of course what you gain in flexibility, you lose in RAD, and you make up in complexity.