cakephp-bootstrap / cakephp3-bootstrap-helpers Goto Github PK

Creating an input like this:

$this->Form->input("domain");

while output a notice: Undefined index: input [ROOT/plugins/Bootstrap3/src/View/Helper/BootstrapFormHelper.php, line 182]

Hi,
One thing I find really stupid about input file is to not be able to clear the selected file.
So we can find many various solutions but one which seems to be the best is that very simple one http://jsfiddle.net/Xotic750/pfeBs/
And despite some comments, it perfectly works on IE11, don't know on previous version and FF and Chrome.

So, as 'useCustomFileInput_2' => true maybe, would it be possible to have a file input with a button which toggles between 'Browse' (or better, the given label) and 'Delete' with color 'danger' (or better, another given label)?

Regards,
Alain

I'm developing a small backend with your Helpers, but when i try to get some content via ajax the inputs get original Cake php Form structure

<div class="input text"><label for="images-0-description">Description</label><input type="text" name="images[0][description]" id="images-0-description"></div>

instead of

<div class="form-group text"><label class=" control-label" for="images-0-description">Description</label><input class="form-control" type="text" name="images[0][description]" id="images-0-description"></div>

thats normally loaded

I did follow but failed, you can mail your source for Bootstrapping CakePHP Helpers 3.x succeeded. Mail your [email protected].

Thank you! Looking forward to help !!

When i update bootstrap3 plugin and edit names from Bootstrap3 to Bootstrap. I got this error.

Error: Trait 'Bootstrap3\View\Helper\BootstrapTrait' not found
File pathToProject\vendor\holt59\cakephp3-bootstrap3-helpers\src\View\Helper\BootstrapHtmlHelper.php
Line: 29

But BootstrapTrait is in same namespace, i do see reason for not working. (Sorry for my english)

The Date field type is not implemented, theres any workaround about it?

Hello,
I propose to add the flash media error in your pack :)

Hey, I have added this to my AppController.php

public $helpers = [
        'Html' => [
            'className' => 'Bootstrap.BootstrapHtml'
        ],
        'Form' => [
            'className' => 'Bootstrap.BootstrapForm',
            'useCustomFileInput' => true
        ],
        'Paginator' => [
            'className' => 'Bootstrap.BootstrapPaginator'
        ],
        'Modal' => [
            'className' => 'Bootstrap.BootstrapModal'
        ],
        'Flash' => [
            'className' => 'Bootstrap.BootstrapFlash'
        ]
    ];

I am getting an error whenever the flash is supposed to be displayed.

Element/.ctp 

Cake\View\Exception\MissingElementException

Does the helper automatically apply to

$this->Flash->error(__('The tag could not be saved. Please, try again.'));

Or did I miss a step?

Thanks,

How can I use icon for prev/next ?

Is it possible to use the paginator like this :

<?= $this->Paginator->numbers([
        'prev'=>['title'=>$this->Html->icon('chevron-left'),'escape'=>false],
        'next'=>['title'=>$this->Html->icon('chevron-right'),'escape'=>false]]); ?>

Proposal :

if (isset($options['prev'])) {
    $title  = '';
    $opt    = [];
    if(is_array($options['prev'])){
        $opt    = $options['prev'];
        $title  = $opt['title'];
        unset($opt['title']);
    }else{
        $title = $options['prev'];
    }
    $options['before'] .= $this->prev($title,$opt) ;
}

The file input is not working the options "help" and the validation errors

Support for panels would be nice: http://getbootstrap.com/components/#panels

(Support for collapsable panels would be even better!). These require a similar big amount of markup as modals, so support in the helper would be great!

Example:

I have a Reservations model that require a start date and end date.
Using the FormHelper in the simplest way

<fieldset>
    <legend><?= __('Request reservation') ?></legend>
<?php
    echo $this->Form->input('date_start', ['type' => 'date']);
    echo $this->Form->input('date_end', ['type' => 'date']);
?>
</fieldset>

gives this result

Adding some debug in the date function returned this

If I reset the previous template after the call to parent::date it works :)

public function date($fieldName, array $options = []) {
    $fields = ['year' => true, 'month' => true, 'day' => true];
    $prev_template = $this->templates('dateWidget');
    // debug('dateWidget: before '.$this->templates('dateWidget'));
    $this->templates([
        'dateWidget' => $this->_getDatetimeTemplate($fields, $options)
    ]);
    // debug('dateWidget: after '.$this->templates('dateWidget'));
    $return = parent::date($fieldName, $options);
    $this->templates(['dateWidget' => $prev_template]);
    return $return;
}

I hope I helped. It's my first time reporting an issue 👍

Hi,

When adding a custom class to an input the attribute class is added twice.

$this->Form->input('name',array('class'=>'input-lg'))

Returns the following

<div class="form-group text">
    <label class="control-label "  for="name">Name</label>
    <input type="text" name="name" class="form-control input-lg"  class="input-lg" id="name" />
</div>

The attribute class exists two times. Most browser don't care about it, but it's not W3C valid and a bit confusing.

I saw someone previously asked how to use templates but when I tried to use myself to add a class to the error messages it didn't work.

The example given was:

public $helpers = [
    'Form' => [
        'className' => 'Bootstrap3.BootstrapFormHelper',
            'templates' => [
                'dateWidget' => '{{day}}{{month}}{{year}}{{hour}}{{minute}}{{second}}{{meridian}}'
            ]
    ]
];

so in my code:

public $helpers = [
    'Form' => [
        'className' => 'Bootstrap.BootstrapForm',
        'templates' => [
            'error' => '<span class="help-block error-message">{{content}}</span>'
        ],
    ],
];

but my error messages did not change. I still only have the class .help-block (which is not helpful for styling if you plan to use .help-block for information purposes in your form)

The following code

echo $this->Navbar->create(
    'The Project',
    [
        'responsive' => true,
        'fluid' => true,
        'fixed' => 'top'
    ]
);
echo $this->Navbar->beginMenu(['class' => 'navbar-right']);
    echo $this->Navbar->link(__('Exit'), ['controller' => 'Users', 'action' => 'logout']);
echo $this->Navbar->endMenu();
echo $this->Navbar->end();

throws the following notice

if I change the beginMenu line in level 0:

$options = $this->addClass ($options, ['nav', 'navbar-nav']);

to this

$options = $this->addClass ($options, 'nav navbar-nav');

then it works

i get this notice in the most recent CakePHP version 3.1.4 but no Validation message:

Notice (8): Array to string conversion [ROOT\vendor\holt59\cakephp3-bootstrap-helpers\src\View\BootstrapStringTemplate.php, line 70]

best regards

Hey @Holt59,

Thanks for the nice plugin. We are using it for the CakeAdmin Plugin (https://github.com/cakemanager/cakeadmin-lightstrap).
Maybe you should think about a 'Companies using CakePHP' section? ;)

Greetz

Bob

Hi,

When we use Form->create(...., ['horizontal' => true']), is it possible to ask a specific input to ignore 'horizontal' => true?
Just because that cause a problem with one of the plugin I use.

Hello,
I'm pretty new with CakePHP. Do you have an example how to use form element template with your helper? In my specific case, in my form, there is a birth date to fill, and I would like to use this template:

'dateWidget' => '{{day}}{{month}}{{year}}'

instead of

'dateWidget' => '{{year}}{{month}}{{day}}{{hour}}{{minute}}{{second}}{{meridian}}'

Thanks for your help.

Hello,
I currently am using the helper in one of my projects, and I was wondering if it was possible to add the possiblity to use icons in the breadcrumbs ?
like this, by example :

echo $this->Html->getCrumbList(null, $this->Html->icon('home'));

Hi, I noticed that when I enabled useCustomFileInput my request started being black holed.

The only way I found to get over this issue was to change the plugin as follows:

File: BootstrapFormHelper.php
Line: 447

Code before:

    $options += ['secure' => true];

Code after:

    $options += ['secure' => false];

I don't have time to investigate further. So, at least, I think it would be great if this setting is taken from the $options set when using the helper.

Example:

    $this->Form->input('image', ['type' => 'file', 'secure' => false]);

Any thoughts?

This code:

<?= $this->Form->submit('Login', ['bootstrap-type' => 'primary']) ?>

Generates this HTML:

<input type="submit" value="Login" class="btn btn-default btn-primary">

Note that there is btn-primary and btn-default. It don't causes any problems at the moment, but I'm pretty sure this is not allowed by Bootstrap.

Type: Feat. request

The same awesome job that you did putting append and prepend options I think you could put a help text option that insert after the input a text, something like that:

$this->Form->input('name', ['helpText' => 'bla bla bla');
//Html generated
//<input ...><p class="help-block">bla bla bla</p>

Hi,
I would like to know if there is a way to display radio buttons one above the others.

Thks.

In Cake2, I could use the 'div' options to edit the wrapping div (add classes or an ID or whatever else) but right now the .form-group div is hard-coded... I don't know how to make that edit myself...

Hola

Seria muy util tener el comando el bake con el template

In horizontal forms, radio boxes are arranged left-adjusted.

Is it possibe to get following output for radioboxes?

<input type="hidden" value="" class="form-control " name="favorite_color">
<div class="form-group">
  <label for="username" class="col-md-2 control-label ">Favorite Color</label>
  <div class="col-md-6">
    <div class="radio">
      <label for="favorite-color-r">
        <input type="radio" id="favorite-color-r" style="color:red;" value="r" name="favorite_color">Red
      </label>
    </div>
    <div class="radio">
      <label for="favorite-color-u">
        <input type="radio" id="favorite-color-u" style="color:blue;" value="u" name="favorite_color">Blue
      </label>
    </div>
    <div class="radio">
      <label for="favorite-color-g">
        <input type="radio" id="favorite-color-g" style="color:green;" value="g" name="favorite_color">Green
      </label>
    </div>
  </div>
</div>

This would give us the radioboxes in the 2nd column as for other form elements in horizontal forms.
Or did I miss an existing feature?

Cheers,
Peter

This does not work as intended:

<?= $this->Form->submit($this->Html->icon('check').' '.__('Save'),
        ['bootstrap-type' => 'primary', 'escape' => 'false']) ?>

The escape option is ignored so the HTML rendered by icon() is escaped.

In general an icon option for buttons might be nice as well. I assume it is a common use-case.

if i try to insert 2 date input on my form only the first one is displayed.
the HTML code of the second one is completly missing

If you simply clone the repository into plugins/Bootstrap3 it was necessary for me to use
Plugin::load('Bootstrap3', ['autoload' => true]);
instead of just
Plugin::load('Bootstrap3');
in config/bootstrap.php

Otherwise i get the following error:

Maybe this should be added to the README.md

Cheers!

Thanks for those helpers it's saving a lot of time for our dev team.

However we have an issue with basic form and checkbox input. The helper add a .form-group div element which wrap .checkbox div element.

It break some advanced form building and we have to had manually a new template string for this case.

It should be awesome if your helper can improve this feature and dynamicaly add the wrapping form-group depending on the case of utilisation.

It would be nice, if bake templates were included, so that the baked templates would automatically contain the correct Bootstrap markup (for the sidebar etc.).

I did some work in this direction for the old version, maybe you could copy something from there: https://github.com/nrother/cakephp3-bootstrap3-helpers/tree/master/src/Template/Bake

Right now we can either have a button with text or an icon. But having both is also a very common use-case.

See the examples under "Bootstrap 3 Examples" at https://fortawesome.github.io/Font-Awesome/examples/

It would be great if one could set a title like i:plus Create and get a button with a plus icon and "Create".

Current the input in a search form created with FormHelper::searchForm has always the default id of search. It would be nice if one could change that, e.g. if you want to have more than one form on the same page.

It tried to add class .btn-primary but .btn-default stays in there and wins over it.
I also tried passing an option ['type' => 'primary'] like you do with the alerts in your example but it's no good too.

Let me start by saying I'm super glad you made these helpers, they rock :)

I'm having an issue where I display an input for a 'datetime' field using 12 hour timeFormat parameter, but the displayed box only shows 12 hours and does not allow selection of AM or PM. Here is the code I'm using to display the input field:

echo $this->Form->input('start_time', ['type' => 'datetime', 
                                                     'interval' => 5,
                                                     'minYear' => date("Y") - 1,
                                                     'maxYear' => date("Y"),
                                                     'timeFormat' => 12,
                                                     'label' => "Start Date and Time"]);

And here is an image of the produced output:

I suppose you already know this .. https://github.com/flatlogic/awesome-bootstrap-checkbox

Hey,
Really nice plugin here, but I can't seem to find any way to change input size (input-lg, input-sm, input-xs). If I provide a "class" option to Form->input, it simply ignores it.

The support for templateVars option was added in CakePHP 3.1.0. In the FormHelper you can find it here:
https://github.com/cakephp/cakephp/blob/928beba6f76c6d1e884ae26f42c86a25717a1a85/src/View/Helper/FormHelper.php#L1063

However, BootstrapFormHelper overrides this function. The line in question that adds templateVars to the array is notably missing here:
https://github.com/Holt59/cakephp3-bootstrap-helpers/blob/950221c851dc22da89a8d85820194c89296f6670/src/View/Helper/BootstrapFormHelper.php#L403

Therefore, this does not work: http://book.cakephp.org/3.0/en/views/helpers/form.html#adding-additional-template-variables-to-templates

I can confirm that it does work correctly after adding FormHelper.php#L1063 before BootstrapFormHelper.php#L40.

Hi all, thanks for your help.

How to create a radio group, as in the link below.
http://getbootstrap.com/javascript/#buttons-checkbox-radio.

I'm on CakePHP 2.x and I do not know how?
And thank you for your plugin.

Hello,
I saw that almost all input() excepting select and textarea; ie text, number, tel, etc... define the id twice:

<div class="form-group tel required"><label class="col-md-2 control-label" for="phone">Téléphone du site :</label><div class="col-md-6"><input class="form-control" placeholder="Téléphone du site" required="required" maxlength="20" **id="phone"** type="tel" name="phone" **id="phone"** /></div></div>

Do you confirm?

Alain

Hello,

When I create a Form with textarea, it's the case of 'address', it doesn't fill the same horizontal space.
How to do it?

Hello there,

First, thanks for releasing this Plugin.

Is is possible to group multiple input inside the same row ?
For exemple, if I want to show 2 input in the same row, I use the following code :

<div class="row">
    <?= $this->Form->input('name', [
        "label" => false,
        "type" => "text",
        'templates' => [
            'inputContainer' => '<div class="col-lg-6">{{content}}</div>'
        ],
    ]);
    ?>
    <?= $this->Form->input('surname', [
        "label" => false,
        "type" => "text",
        'templates' => [
            'inputContainer' => '<div class="col-lg-6">{{content}}</div>'
        ],]);
    ?>
</div>

Am i missing something or is the only way ?

Thanks in advance

Hi Mickaël,

Did I miss something or you forgot to patch the input file button like http://www.abeautifulsite.net/whipping-file-inputs-into-shape-with-bootstrap-3/ ? ;-)

Regards,
Alain

Hello,

The helper seems to get stuck in an infinite loop since the latest patch:
15 0.0616 4201232 call_user_func_array ( ) ../BootstrapFormHelper.php:220
16 0.0616 4201728 Bootstrap3\View\Helper\BootstrapFormHelper->date( ) ../BootstrapFormHelper.php:220
17 0.0617 4203576 Bootstrap3\View\Helper\BootstrapFormHelper->_wrapTemplates( ) ../BootstrapFormHelper.php:576
18 0.0617 4203352 call_user_func_array ( ) ../BootstrapFormHelper.php:220
19 0.0617 4203776 Bootstrap3\View\Helper\BootstrapFormHelper->date( ) ../BootstrapFormHelper.php:220
20 0.0618 4205624 Bootstrap3\View\Helper\BootstrapFormHelper->_wrapTemplates( ) ../BootstrapFormHelper.php:576
21 0.0618 4206080 call_user_func_array ( ) ../BootstrapFormHelper.php:220
22 0.0618 4206504 Bootstrap3\View\Helper\BootstrapFormHelper->date( ) ../BootstrapFormHelper.php:220

...and so on, until either xdebug reaches its nesting level or execution time runs out.

Hello,
It seems we talk about this feature already and I think you told me this functionality should be available in the last versions but I didn't see it in your wiki page.
I tried using the cakePHP3 helper method but I cannot get it working.
Is it normal?
Is there a way to use it with your module?

The ctp code I use is:

<?= $this->Form->radio(
     'agpoiaudios.'.$ntext.'.rec_mod',
     [
          ['value' => 'sv', 'text' => __('Synthèse vocale')],
          ['value' => 'vh', 'text' => __('voix humaine (sur devis)')],
     ]
 ); ?>

The generated html code is:

<div class="radio">
    <label for="agpoiaudios-0-rec-mod-sv">
        <input type="radio" name="agpoiaudios[0][rec_mod]" value="sv" id="agpoiaudios-0-rec-mod-sv">Synthèse vocale
    </label>
</div>
<div class="radio">
    <label for="agpoiaudios-0-rec-mod-vh">
        <input type="radio" name="agpoiaudios[0][rec_mod]" value="vh" id="agpoiaudios-0-rec-mod-vh">voix humaine (sur devis)
    </label>
</div>

Do you see any reason why it doesn't work?

regards,
Alain

Right now i am using following code:

<?= $this->Paginator->numbers([
       "size"=>"large",
       "prev"=>"i:chevron-left",
       "next"=>"i:chevron-right"
        ]);?>

and this generates pagination with prev next buttons. Please add support to append first/last buttons to pogaination as well.
Using next() and prev() causes generation of separate unordered lists.

Maybe i am using it wrong?

Hey,

First of all thanks for the nice plugin. We are using it for https://github.com/cakemanager/cakeadmin-lightstrap.
I am trying to get composer working but get the following error:

Your requirements could not be resolved to an installable set of packages.

  Problem 1
    - Installation request for cakemanager/cakeadmin-lightstrap dev-master -> satisfiable by cakemanager/cakeadmin-lightstrap[dev-master].
    - cakemanager/cakeadmin-lightstrap dev-master requires holt59/cakephp3-bootstrap3-helpers dev-master -> no matching package found.

Potential causes:
 - A typo in the package name
 - The package is not available in a stable-enough version according to your minimum-stability setting
   see <https://groups.google.com/d/topic/composer-dev/_g3ASeIFlrc/discussion> for more details.

So can you tell me why composer sais that your package couldn't be found?

Thanks!

On form template:

<?= $this->Form->file('imagem_capa') ?>

Is raising this error:

Undefined index: id [ROOT\vendor\holt59\cakephp3-bootstrap3-helpers\src\View\Helper\BootstrapFormHelper.php, line 421]