*I speak English not well. So i'm going to post the code now.*
Form code:
protected $elementDecorators = array('ViewHelper','Errors','Description','Label',
array('HtmlTag',array('tag' => 'div','class' => '_wrapperElement')
));
public function init(){
$this->addElement('text','mytext',array(
'class' => '_inputText',
'label' => 'Mytext',
'required' => true,
'decorators' => $this->elementDecorators
));
$this->setDecorators(array('FormElements',array('HtmlTag',array('tag' => 'div','class' => '_formWrapper')),'Form'));
}
Output:
<form method="post" action="" enctype="application/x-www-form-urlencoded">
<div class="_formWrapper">
<div class="_wrapperElement">
<label class="required" for="mytext">Mytext</label>
<input type="text" class="_inputText" value="" id="mytext" name="mytext">
</div>
</div>
</form>
Now i want a div wraps Label and Input element like this:
<form method="post" action="" enctype="application/x-www-form-urlencoded">
<div class="_formWrapper">
<div class="_wrapperElement">
<div class="_wrapperLabel">
<label class="required" for="mytext">Mytext</label>
</div>
<div class="_wrapperInput">
<input type="text" class="_inputText" value="" id="mytext" name="mytext">
</div>
</div>
</div>
</form>
How to do that?
I tried many times but i can't do it.
Thanks!
protected $elementDecorators = array('ViewHelper','Errors','Description', array('Label', array('tag' => 'div', 'class' => '_wrapperLabel')
),
array('HtmlTag',array('tag' => 'div','class' => '_wrapperInput')
));
i found the solution that render decorators to ViewScript.
Related
I would like to have a form available on every page in my web app. So I created a widget with a form.
class AddNewURL extends Widget{
public $model;
public function init()
{
parent::init();
if ($this->model === null) {
$this->model = new ProductUrlForm();
}
}
public function run()
{
return $this->render('addNewURLForm', [
'model' => $this->model,
]);
}
}
and widget view
<div class="modal fade bs-example-modal-lg" id="newURL" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<?php Pjax::begin(); ?>
<?php $form = ActiveForm::begin([
'action' => Url::to(['site/new-url']),
'options' => ['data' => ['pjax' => true]],
]) ?>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Add new URL</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<?= $form->field($model, 'url', ['errorOptions' => ['class' => 'help-block', 'encode' => false]])
->textInput(['maxlength' => false])
?>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Add</button>
</div>
<?php ActiveForm::end() ?>
<?php Pjax::end(); ?>
</div>
</div>
</div>
and this how I use this widget in my layouts/main.php
<?= \app\widgets\AddNewURL::widget() ?>
in my site/new-url action I have
public function actionNewUrl()
{
$model = new ProductUrlForm();
$model->status = STATUS_NEW;
if ($model->load(Yii::$app->request->post()) && $model->save()) {
//return success message
}
return $this->render('index', [
'model' => $model,
]);
}
and now when I submit form data goes to my action, the form is reset and that's all. How to show validation error or success message using pjax? In my model I have few custom validation rules.
Maybe there is better solution to use one form on all pages?
Action actionNewUrl() must render view addNewURLForm so Pjax can replace old form with new html recieved from the action.
It is better to place your widget, controller and form model to separate module.
I am creating a form with Zend Framework 2. I'm using Form class to define form elements like this:
class PropertyForm extends Form
{
public function __construct($name=null)
{
...
$this->add(array(
'name' => 'zip',
'type' => 'Text',
'required' => false,
'options' => array(
'label' => 'Zip Code',
),
'attributes' => array(
'id' => 'zip',
'class' => 'form-control',
),
));
...
}
}
And in view I display this form element with the following code:
<div class="form-group"><?php echo $this->formRow($form->get('zip')); ?></div>
This generates the following HTML output:
<div class="form-group">
<label for="zip">Zip Code</label>
<input type="text" name="zip" id="zip" class="form-control" value="">
</div>
What I want to achieve is to have <div class="my-class"> around the input field as well. So the desired HTML output would be:
<div class="form-group">
<label for="zip">Zip Code</label>
<div class="my-class">
<input type="text" name="zip" id="zip" class="form-control" value="">
</div>
</div>
How can I achieve that?
You could get label and the element itself with two different calls:
For label:
<?php echo $this->formLabel($yourForm->get('your_element')); ?>
For the elements:
<?php echo $this->formSelect($yourForm->get('your_element_select')); ?>
<?php echo $this->formText($yourForm->get('your_element_text')); ?>
<?php echo $this->formRadio($yourForm->get('your_element_radio')); ?>
So, for you example, it would be something like:
<div class="form-group">
<?php echo $this->formLabel($form->get('zip')); ?>
<div class="my-class">
<?php echo $this->formText($form->get('zip')); ?>
</div>
</div>
I have created a form where a user can add elements depending on the number of names needed. My code is as follows
<div class="input_fields_wrap">
<div class="row">
<div class="form-group col-xs-12 col-sm-3 form-group-sm">
{!! form::label('first_name[]', 'First Name: ') !!}
{{--{!! form::text('first_name[]', null, ['class' => 'form-control', 'placeholder' => 'First Name']) !!}--}}
<input type="text" name="first_name[]" value="" class="form-control" placeholder="First Name">
</div>
<div class="form-group col-xs-12 col-sm-3 form-group-sm">
{!! form::label('middle_name[]', 'Middle Name[s]: ') !!}
{{--{!! form::text('middle_name[]', null, ['class' => 'form-control', 'placeholder' => 'Middle Name[s]']) !!}--}}
<input type="text" name="middle_name[]" value="" class="form-control" placeholder="Middle Name[s]">
</div>
<div class="form-group col-xs-12 col-sm-3 form-group-sm">
{!! form::label('last_name[]', 'Last Name: ') !!}
{{--{!! form::text('last_name[]', null, ['class' => 'form-control', 'placeholder' => 'Last Name']) !!}--}}
<input type="text" name=last_name[]" value="" class="form-control" placeholder="Last Name">
</div>
</div>
</div>
<button class="btn btn-success add_field_button"><i class="fa fa-user"></i> Add Another Person (Max 5)</button>
When the form fails it's validation it should return to the original form, display validation errors and re-populate the form.
Obviously this needs to loop though the returned values but I am unable to get the returned form content for these elements.
I can dump out the errors but not sure how to get the returned form element values :(
I've made a login form and now I need to have the same code in one of my Cakephp project but it doesn't work..
<!-- LOGIN SECTION START -->
<section id="login">
<div class="container">
<div class="row">
<div class="Absolute-Center is-Responsive">
<h1 class="text-center form-login-title">Log In</h1>
<div class="col-sm-12 col-md-12 col-md-offset-0">
<?php echo $this->Session->flash('auth'); ?>
<?php echo $this->Form->create('User');?>
<div class="form-group inner-icon right-icon"> <!--USER NAME-->
<i class="glyphicon glyphicon-user"></i>
<input class="form-control" type="text" name='username' placeholder="username"/>
</div>
<div class="form-group inner-icon right-icon"> <!--PASSWORD-->
<i class="glyphicon glyphicon-lock"></i>
<input class="form-control" type="password" name='password' placeholder="password"/>
</div>
<?= $this->Form->end(__('Sign In')); ?> <!-- SUBMIT BUTTON -->
<div class="form-group text-center">
Forgot Password
</div>
</div><!-- /.col-sm-12 -->
</div>
</div><!-- /.row -->
</div><!-- /.container -->
</section>
<!-- LOGIN SECTION END -->
So with that snippet does not let me log in (the back end is not the problem)
Oh, and how can I change the submit button style ? I've tried <?= $this->Form->end(__(Sign In), array('class'=>'btn-primary')); ?>
but it doesn't help much :(
Thanks
You should use the CakePHP helpers, so instead plain HTML:
Change this:
<input class="form-control" type="text" name='username' placeholder="username"/>
Into this:
<?php
echo $this->Form->input('username', array(
'class' => 'form-control',
'placeholder' => 'username',
'label' => false
));
?>
And this:
<input class="form-control" type="password" name='password' placeholder="password"/>
Into this:
<?php
echo $this->Form->input('password', array(
'type' => 'password',
'class' => 'form-control',
'placeholder' => 'password',
'label' => false
)); ?>
CakePHP Helper will print the input fields with the correct name values for each one, so in your controller you receive the correct data through the array $this->request->data.
For the button style try:
<?=$this->Form->end('Sign In', array('class'=>'btn btn-danger'))?>
Like Ricardo mentioned,use CakePHP syntax and conventions.
Also it will be more helpful if you provide your controller actions. Probably your action is wrong.
For more things about forms and auth here:
http://book.cakephp.org/2.0/en/core-libraries/helpers/form.html
http://book.cakephp.org/2.0/en/core-libraries/components/authentication.html
<form enctype="application/x-www-form-urlencoded" action="" method="post">
<ul>
<div>
<fieldset id="fieldset-groups"><legend>Endereço</legend>
<li>
<label for="name" class="optional">Name</label>
<input type="text" name="name" id="name" value="">
<div class="errors">
<p>Error</p>
</div>
</li>
</fieldset>
</div>
</ul>
</form>
How do I make my way the code above, using the decorator zend?
I tried this way:
$this->addDecorator('FormElements')
->addDecorator('HtmlTag', array('tag' => 'ul'))
->addDecorator('Form');
$this->setElementDecorators( array(
'ViewHelper',
'Label',
'Errors',
new Zend_Form_Decorator_HtmlTag(array('tag' => 'li'))
));
$this->setDisplayGroupDecorators( array(
'FormElements',
'Fieldset',
'FormErrors',
new Zend_Form_Decorator_HtmlTag(array('tag' => 'li')),
));
The problem is that I need to float the label and text elements, so I tried to use a list.
This was the only way I could.