How can I add a text behind a form element in Zend Framework? Let's say I have a text input field, first there is a label, bellow the label there is an actual input field but I want to add some additional text (2-3 sentences) behind the input field. Something like a short tip or suggestion what is the best value for that field.
You can simply add a description to the input element, e.g.
$element = new Zend_Form_Element_Text('itemName', array(
'label' => 'My Label',
'description' => 'Enter some text'
));
From the ZF Manual Chapter 23.7.3. Zend_Form_Decorator_Description:
By default, if no description is present, no output is generated. If the description is present, then it is wrapped in an HTML p tag by default, though you may specify a tag by passing a tag option when creating the decorator, or calling setTag(). You may additionally specify a class for the tag using the class option or by calling setClass(); by default, the class 'hint' is used.
So to modify the decorator you would write something like
$element->setDecorators(
array(
'ViewHelper',
'Errors',
array('Description', array('placement' => 'append',
'escape' => false,
'tag' => 'span')),
array('HtmlTag', array('tag' => 'dd')),
array('Label', array('tag' => 'dt', 'escape' => false))
));
You also might want to check this series of tutorials about Zend Form Decorators.
You can use the description option as an element option to add a <p> tag with your description, after the element (with default decorators.)
You strategy then simply requires some CSS to position the description in the right place. Something like
dd.myelement{
position: relative;
}
dd.myelement p {
position: absolute;
top:0;
right: 0;
}
You'll probably need z-index properties on the input and p too:
dd.myelement p {
z-index: 1;
}
dd.myelement input {
z-index: 2;
}
There might be a CSS property missing (I've written that from memory) but I hope you get the idea :)
Richard,
you need a decorator! :) They are sometimes a little complicated, but I've been using the following tutorial, which is probably a little outdated, but not less helpful. Especially check the use of legend. I think that's perfect for what you want to do.
Hope this helps!
Related
I have a form that has two FieldGroups, and in one of the FieldGroups I have a SelectionGroup.
The SelectionGroup_Items show up in the form FieldGroup but the radio boxes to select one of the options doesn't show. If I remove the FieldGroup it then works again.
I've looked at the framework templates, and if I change the FieldGroup_holder.ss SmallFieldHolder to FieldHolder the radio boxes appear again and work correctly. I've tried following the templates to see which one isn't obeying the SelectionGroup but I keep getting lost.
Here's an example bit of code
$fields = FieldList::create(
FieldGroup::create(
TextField::create('Name', 'Name')
),
FieldGroup::create(
SelectionGroup::create(
'Test1or2',
array(
SelectionGroup_Item::create(
'Test1', array(
TextField::create('Test1', 'Test1')
),
'Test1'
),
SelectionGroup_Item::create(
'Test2', array(
TextField::create('Test2', 'Test2')
),
'Test2'
)
)
)
)
),
FieldList::create(
FormAction::create('submit', 'Submit')
)
You could add another fieldset then set it's attributes to id="hidden_field" aria-hidden="true". In the css document you could do the following.
#hidden_field{
display:none;
height:0;
width:0;
margin:0;
padding:0;
visibility: hidden;
}
This should hide SilverStripe Framework's query behavior.
In my own php forms I had random brackets appearing whenever someone submitted a new form numerous times under different part-id numbers. I used this approach to hide the random brackets on my site.
I'm doing a project for uni, and as a part of it I am translating some of the pages, and need them in RTL.
These text fields are declared in a class on a different file.
I've managed to set the calling page to RTL (using [html dir='rtl']), which moved all the elements to the right of the page, but the labels of the text elements are to their left, and aligned to the left of the page.
Using [html dir='rtl'] in this file had no effect.
These are the relevant parts of the code (I think):
$keywords = new Zend_Form_Element_Text('keywords' , array('size' => '30'));
$keywords->setLabel('Keywords from Abstract')
->addFilter('StripTags')
->addFilter('StringTrim')
->setDescription('Enter one or more keywords, separated by whitespace.')
;
// Definition of additional (almost identical) elements
$this->addElements(array(..., $keywords , ... ));
$this->setDecorators(array(
'FormElements',
array('HtmlTag', array('tag' => 'dl', 'class' => 'search')),
array('Description', array('placement' => 'prepend')),
'Form'
));
How can i move the labels to the right of the text elements?
Note that I've tried changing the last line to say 'placement' => 'append' , which did not seem to change anything.
Thanks in advance
You can change position of label decorator this way:
$decorator = $keywords->getDecorator('Label');
if ($decorator) $decorator->setOption('placement', Zend_Form_Decorator_Abstract::APPEND);
Than change styles for proper form output:
form dd {display: inline-block; width: 60%;}
form dt {display: inline-block; width: 35%;}
I'm trying to disable this CakePHP combo:
echo $this->Form->input('backupid', array('options' => $users_backup, 'class'=>'autocompletar', 'empty' => true, "label"=>__('Backup'), 'id' => 'cmbBackup'));
When I click this Checkbox:
echo $this->Form->input('criticalresource');
I've tried to add the property 'disabled' and 'readonly' in every combo element
The following image contains part of my DOM where you can see the Checkbox and the Combobox :
¿Is there any way to DISABLE that combo? I'd rather prefer a JS procedure, but every answer is welcome!
Thank you guys!
I could find an alternative answer: I'll put a 'div' above and insert this class inside:
.disabledbutton {
pointer-events: none;
opacity: 0.4;
}
Replace your critical resource input with the following code
echo $this->Form->input('criticalresource',array('onclick'=>'disableCombo();'));
And in JavaScript
<script>
function disableCombo()
{
var cmbBackup = document.getElementById("cmbBackup");
cmbBackup.attr('disabled','disabled');
}
</script>
I'm using Zend_Form. I'd like to make a forgot password form that is all on one line like this:
label: [ field ] [ submit button ]
And I'd like it to be all within a single paragraph tag. I'd like the paragraph tag to be inside the form tag. So, basically, I'd like to replace Zend_Form's default DL tag with a P tag. I can do it, sort of, but not exactly.
If I use the default, like so:
class Application_Form_Forgot {
public function init() {
// my fields, no special decorators...
}
}
That produces this HTML:
<form {the attributes} ><dl class="zend_form"> {the fields} </dl></form>
I'd like this HTML instead:
<form {the attributes} ><p> {the fields} </p></form>
Here's what I've tried:
class Application_Form_Forgot {
public function init() {
// my fields...
$this->setDecorators(
array(
'FormElements',
'Form',
array('HtmlTag', array('tag' => 'p')),
)
);
}
}
But that produces this HTML:
<p><form {the attributes} > {the fields} </form></p>
The paragraph tags surround the form. Not exactly what I'd like.
I've also tried:
Googling and reading a bunch of posts on StackOverflow and elsewhere about how to remove the DL tags. Forgive me if I missed the answer somewhere and this is a duplicate.
Reading the Zend source to figure out a way to do it. I found the DlDt Decorator, but that seems to only apply to the elements, not the form.
Coming to grips with having the paragraph tag outside the form and moving on with my life.
Can someone please point me in the right direction - if this is even possible?
Thanks,
Phillip
You were close, change what you had to:
$this->setDecorators(
array(
'FormElements',
array('HtmlTag', array('tag' => 'p'))
'Form',
)
);
If you imagine decorators working by each one rendering 'around' what was there before, with this order it renders the form elements, then around that it puts the paragraph, and then around that it puts the form tag.
I'm trying to set the inner html of the < span > tag here , so it looks like:
Group
this is what i have so far:
$form->addDisplayGroup(
array(
................
),
'maingroup1',
array(
'legend'=>'',
'disableDefaultDecorators'=> true,
'decorators'=> array('FormElements',
array('FieldSet',array('class'=>'dashed-outline2')),
array(array('SpanTag' => 'HtmlTag'), array('tag'=>'span','class' => 'group',)),
array('HtmlTag',array('tag'=>'div','id'=>'group1','class'=>'group','openOnly'=> true))
)
)
);
Is there a setter / property that I can use to set the inner text of the < span> element using Zend_form_decorators?
Thanks.
When you have to start "hacking" or "figuring out how..." the best way to do something, its usually a hint you may be going down the wrong road. :-/
My best advice - based on how I understand your question - is that you might have to develop your own partial view for this display group. When you create your displaygroup, you can set your own decorators:
decorators' => array(
array('ViewScript', array('viewScript' => 'path/to/viewscript.phtml')),
),
This will allow you the find-grained control you need. I know, it seems like a headache to have to create that view for your display group, but, IMHO, that is the 'best practice' to modify decorator contents when there is no clear way.