add button position POS_ROW_BEGIN is shown under the first column

[ritacionfoli]

Hi, as written in the title, if I set 'addButtonPosition' like MultipleInput::POS_ROW_BEGIN the add button is shown under the first column

how can I solve this? Thanx

[unclead]

@ritacionfoli post the part of your code (view should be enough) to reproduce the issue. Also, write what version of the widget you use

[ritacionfoli]

I'm using the latest version. This is my view code:

<div class="row">
                    <?php

                    echo $form->field($model, 'figli')->widget(MultipleInput::className(), [
                        'max' => 4,
                        'id' => 'my_id',
                        'allowEmptyList' => false,
                        'addButtonPosition' => MultipleInput::POS_ROW_BEGIN,
                        'rowOptions' => [
                            'id' => 'row{multiple_index_my_id}', 
                        ],
                        'columns' => [

                            [
                                'name'  => 'cognome',
                                'title' => 'Cognome',
                                'headerOptions' => ['style' => 'width: 105px']
                            ],
                            [
                                'name'  => 'nome',
                                'title' => 'Nome',
                                'headerOptions' => ['style' => 'width: 105px']
                            ],
                            [
                                'name'  => 'data_nascita',
                                'type'  => DatePicker::className(),
                                'title' => 'Nato/a il',
                                'options' => [
                                    'type' => DatePicker::TYPE_INPUT,
                                    'pluginOptions' => [
                                        'autoclose' => true,
                                        'format' => 'dd/mm/yyyy',
                                        'todayHighlight' => false
                                    ],

                                ],
                                'headerOptions' => ['style' => 'width: 120px']
                            ],
                            [
                                'name'  => 'luogo_id',
                                'title' => 'Cod.',
                                'type'  => unclead\multipleinput\MultipleInputColumn::TYPE_HIDDEN_INPUT,
                                'value' => 0
                            ],
                            [
                                'name'  => 'luogo',
                                'title' => 'Luogo nascita',
                                'type'  => \kartik\typeahead\Typeahead::className(),
                                'headerOptions' => ['style' => 'width: 130px'],
                                'options' => [
                                    'scrollable' => true,
                                    'dataset' => [
                                        [
                                            'datumTokenizer' => "Bloodhound.tokenizers.obj.whitespace('value')",
                                            'display' => 'value',
                                            'remote' => [
                                                'url' => Url::to(['//mensa/anagrafica/default/comuni-list']) . '?q=%QUERY',
                                                'wildcard' => '%QUERY',
                                            ],
                                            'limit' => 10,
                                        ]
                                    ],
                                    'pluginEvents' => [
                                        "typeahead:selected" => "function(obj, item) { 
                                var id = obj.target.id;
                                var spli = id.split('-');
                                var index = spli[2];
                                $('#signupform-figli-'+index+'-luogo_id').val(item.id);

                                return true; 
                                }",
                                        "typeahead:render" => "function() { 
                                console.log('Whatever...'); 
                                }",
                                    ]
                                ]
                            ],
                            [
                                'name'  => 'cf',
                                'title' => 'Codice Fiscale',
                                'options' => ['maxlength' => 16, 'size' => 16, 'minlength' => 16],
                                'headerOptions' => ['style' => 'width: 100px']
                            ],
                            [
                                'name'  => 'scuola',
                                'title' => 'Scuola',
                                'type'  => \kartik\select2\Select2::className(),
                                'options' => [
                                    'id' => 'parent-{multiple_index_my_id}',
                                    'theme' => \kartik\select2\Select2::THEME_BOOTSTRAP,
                                    'attribute' => 'ID',
                                    'data' => ArrayHelper::map($scuole::find()->all(), 'ID', 'nome'),
                                ],
                                'headerOptions' => ['style' => 'width: 110px']
                            ],
                            [
                                'name' => 'classe',
                                'title' => 'Classe',
                                'type' => \kartik\depdrop\DepDrop::className(),
                                'defaultValue' => 0,

                                    'type' => \kartik\depdrop\DepDrop::TYPE_SELECT2,
                                    'select2Options' => ['pluginOptions' => ['allowClear' => true]],
                                    'pluginOptions' => [
                                        'depends' => ['parent-{multiple_index_my_id}'],
                                        'initialize' => true,
                                        'initDepends' => ['parent-{multiple_index_my_id}'],
                                        'url' => Url::to(['//mensa/users/user/classi']),
                                        'placeholder' => 'Seleziona la classe',
                                        'loadingText' => 'Caricamento classi...',
                                    ],
                                ],
                                'headerOptions' => ['style' => 'width: 70px']
                            ],
                            [
                                'name' => 'servizio',
                                'type'  => 'dropDownList',
                                'title' => 'Servizio',
                                'defaultValue' => 0,
                                'items' => [

                                    1 => 'MENSA',
                                    2 => 'SCUOLABUS',
                                    3 => 'MENSA+SCUOLABUS'
                                ],
                                'options' => [
                                    'onchange' => <<< JS
                                    var id = this.id;
                                    var spli = id.split('-');
                                    var index = spli[2];
                                    if($(this).val()<2)
                                    {
                                        $('#signupform-figli-'+index+'-trasporto').attr("disabled", "disabled");
                                        $('#signupform-figli-'+index+'-fermata').attr("disabled", "disabled");
                                        if($('#delegati').css('display')=="block")
                                        {
                                            var flag = true;
                                            $('td.list-cell__servizio select').each(function() {
                                                if($(this).val()>1)
                                                {flag = false; return true;}
                                            });
                                            if(flag==true){
                                                $('#delegati').css('display', 'none');
                                            }
                                        }
                                    }
                                    else
                                    {
                                        $('#signupform-figli-'+index+'-trasporto').removeAttr("disabled");
                                        $('#signupform-figli-'+index+'-fermata').removeAttr("disabled");
                                        if($('#delegati').css('display')=="none")
                                        {
                                            var flag = true;
                                            $('td.list-cell__servizio select').each(function() {
                                                if($(this).val()<2)
                                                {flag = false; return true;}
                                            });
                                            if(flag==true){
                                                $('#delegati').css('display', 'block');
                                            }
                                        }
                                    }
JS
                               ],
                                'headerOptions' => ['style' => 'width: 120px']
                            ],
                            [
                                'name' => 'trasporto',
                                'type'  => 'dropDownList',
                                'title' => 'Trasporto',
                                'defaultValue' => 0,
                                'items' => [
                                    1 => 'ANDATA+RITORNO',
                                    2 => 'SOLO ANDATA',
                                    3 => 'SOLO RITORNO'
                                ],
                                'headerOptions' => ['style' => 'width: 120px']
                            ],
                            [
                                'name' => 'fermata',
                                'title' => 'Fermata(se diversa da indirizzo)',
                                'headerOptions' => ['style' => 'width: 140px']
                            ]
                        ]
                    ])->label(false);

                    ?>
                </div>

[unclead]

@ritacionfoli can you also send a screenshot from the Chrome dev tool showing the HTML to ensure that the button is really in the same td as td for column cognome?

[ritacionfoli]

[ritacionfoli]

Hi, if I modify renderHeader() function from TableRenderer.php with this code before it renders the cells:

if($this->isAddButtonPositionRowBegin()) { $cells[] = $this->renderButtonHeaderCell(); }

the widget renders the table without errors, like below

[unclead]

fixed in 7022e484a120a3d5473e27748bed2c8a4b7ce75a (yep, 3 years after the issue was created 😄 )