CakePHP & Bootstrap - date field layout - css

Im beginning with both bootstrap and CakePHP 2.x. I baked my views with https://github.com/EKOInternetMarketing/BootstrapCake but there is a problem with date-fields layout. The view looks like this
<div class="form-group">
<?php echo $this->Form->input('booking_date', array('class' => 'form-control', 'placeholder' => 'Booking Date'));?>
</div>
But the problem is that CakePHP creates three selects from a date-field which are all 100% width, which messes up the form and the fields look like this, while it should be three selects side-by-side:
Apparently bootstrap 2 had classes for smaller selects, but bootstrap 3 doesnt anymore. Any ideas how to get it looking like it should?

For cakephp3, you have to do things a little differently:
echo $this->Form->input('booking_date', ['year' => ['class' => 'form-control'], 'month' => ['class' => 'form-control'], 'day' => ['class' => 'form-control'] ]);
http://book.cakephp.org/3.0/en/views/helpers/form.html#creating-datetime-inputs

For input of type date in CakePHP you aren't able to wrap each select element by tag you like in standard way using div option, but there is 3 options which can handle it - between, separator and after. Below is example which set your selects inline.
<div class="form-group">
<?php echo $this->Form->input('booking_date', array(
'class' => 'form-control',
'placeholder' => 'Booking Date',
'div' => array('class' => 'form-inline'),
'between' => '<div class="form-group">',
'separator' => '</div><div class="form-group">',
'after' => '</div>'
));?>
</div>
If you using bootstrap grid you can get even better result using its classes to set this selects inline.

Related

Select box changed to Readonly when displayed on modal in symfony?

I am making form in symfony, I create a select box product in ProductType.php :
$form->add(
'product',
ChoiceType::class,
[
'choices' => array_flip($product),
'label' => 'Product',
'label_attr' => ['class' => 'control-label'],
'attr' => ['class' => 'form-control film-list not-chosen'],
'placeholder' => '-- Select product --',
'multiple' => false,
'required' => false
]
);
in View :
<?php echo $view['form']->start($form); ?>
<div class="col-md-12">
<div class="row">
<div class="col-md-6">
<?php echo $view['form']->row($form['product']); ?>
</div>
</div>
</div>
<?php echo $view['form']->end($form);
And it shows successfully on the theme. But my theme uses modal of bootstrap. When shown above, my select box is changed to readonly, cannot enter keywords. Where did I go wrong. Please everyone help me.
Update:
I have added 'readonly' => false to attr in the form but it still doesn't work.

Issues with for loop when switching from radio to checkbox

We have a wordpress site using Twig and advanced custom fields to show a custom post type value on a page. There used to be just one value for the role field and we used radio buttons. We had to switch that to checkboxes because multiple roles need to be selected for some posts.
That went fine but now the for loop that we had in place doesn’t work for posts with multiple roles selected. It still displays posts which have one role selected, however. I’d appreciate any help with this as it’s written in Twig and that’s completely foreign to me! Is there a way to check for both conditions and something different for each? Or is there a way to edit every existing post to update the field so that it will always return an array?
Tried checking with ACF support but they were not familiar with using twig.
This is the .twig page.
<section class="section people">
<div class="row row-17-column">
<h1 id="team" class="header-large center">Our Team</h1>
<div class="bio-profiles">
{% for team in team %}
<bio-profile bio-id="'{{team.ID}}'" :bio-length="{{team.biography|length}}">
<img slot="photo" src="{{TimberImage(team.photo).src}}" alt="{{TimberImage(team.photo).caption}}">
<h3 slot="name" class="header-small full-width">{{team.first_name}}<br>{{team.last_name}}</h3>
<p slot="position" class="profile-position">{{team.job_title}}<br />{{team.company}}</p>
<div slot="related" class="related-stories hide-small"></div>
<p slot="quote">“{{ team.quote }}”</p>
<p slot="bio">{{ team.biography }}</p>
</bio-profile>
{% endfor %}
</div>
</div>
</section>
Here is the array that needs to be modified to pull in more than one value. They could also have a value for director or advisor along with team. there are 3 total value options.
$team = Timber::get_posts(
array(
'post_type' => 'person',
'meta_key' => 'last_name',
'orderby' => 'meta_value',
'order' => 'ASC',
'posts_per_page' => -1,
'meta_query' => [
array(
'key' => 'role',
'value' => 'team'
)
]
));
When we switched from radio to checkboxes It still displays posts which have one role selected but if there is more than one, they don't display at all.
As has been highlighted, you're doing a query to bring back the role team as opposed to all the roles you've now added. Changing your loop to the following should be sufficient, simply update the $roles array with the value of each of your roles:
$roles = array('team', 'director', 'advisor');
$team = Timber::get_posts(
array(
'post_type' => 'person',
'meta_key' => 'last_name',
'orderby' => 'meta_value',
'order' => 'ASC',
'posts_per_page' => -1,
'meta_query' => [
array(
'key' => 'role',
'value' => $roles,
'compare' => 'IN'
)
]
)
);

Using CSS classes in the Drupal 7 form API

I have a checkbox defined in a form:
$form['membership_block']['membership_info_is_verified'] = array(
'#type' => 'checkbox',
'#title' => t('<strong>I confirm my information is correct.</strong>'),
'#description' => t('Select the checkbox here to confirm your information is correct, then be sure to <strong>click the Save button</strong> below to save your change.'),
);
I would like the title and description to be surrounded by a box with a light green background. I have not been able to figure out how to specify this.
Form elements can have (optional) elements '#prefix' and '#suffix'.
$form['membership_block']['membership_info_is_verified'] = array(
'#prefix' => '<div class="green_background">',
'#suffix' => '</div>',
// ...
);
This way you can surround the HTML code of Form elements with additional code.

Zend Form Decorators to embed label and elements

I have absolutely no idea how to use the decorators in Zend!
If you create a basic straightforward form without decorators, the labels go in DT and the elements go into DD. And they all go one after another.
So how do I make it so that each label and its corresponding element also go inside a div?
Thanks so much!
Kousha
I love decorators! But they are extremely hard to master. Its a good thing your questions is an easy one.
I use a function this in my forms
public function getElementDecorators()
{
return array(
'ViewHelper',
'Errors',
array('Description', array('tag' => 'p', 'class' => 'description')),
array('HtmlTag', array('tag' => 'dd', 'id' => array('callback' => array(get_class($this), 'resolveElementId')))),
array('Label', array('tag' => 'dt')),
array(array('elementContainer' => 'HtmlTag'), array('tag' => 'div', 'class' => 'element-container')),
);
}
then for each of my elements in the form I create them like so.
$this->addElement('Text', 'wordup', array(
'label' => 'Put your words here',
'attribs' => array('class' => 'textbox-fancy'),
'decorators' => $this->getElementDecorators()
));

Showing children links from a custom menu in Drupal 7

I'm new to Drupal so bear with me. I'm using the Omega theme (http://drupal.org/project/omega) and created a custom menu to use as the main menu. In the template I'm using this to get and display the menu:
<?php print theme('links', array('links' => menu_navigation_links('menu-omega-main-menu'), 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'inline', 'clearfix', 'main-menu'))));?>
When I go to view the site, the menu shows, however the children menu links do not get rendered. I also attempted this:
<?php print theme('links', array('links' => menu_navigation_links('menu-omega-main-menu',1), 'attributes' => array('id' => 'main-menu', 'class' => array('links', 'inline', 'clearfix', 'main-menu'))));?>
to try to set the level depth the menus are rendered but then doesn't show at all.
To the first question that most people will try to ask, yes I have 'Show as expanded' checked.

Resources