Question

在CakePHP中，我创建了一个多个选择字段，其中填充了一堆复选框。我试图把它设计成一个bootstrap手风琴，这样每个optgroup都可以崩溃。

输入：

echo $this->Form->input('Subject', array(
    'class' => 'checkbox-inline no_indent',
    'type' => 'select',
    'multiple' => 'checkbox',
    'options' => $options
));
$options = array(
    __('Primary') => array(
        '1' => __('General'), 
        '2' => __('English'),
        '3' => __('Maths'),
        '4' => __('Science')            
    ),
    __('Secondary') => array(
        '5' => __('General'), 
        '6' => __('English'),
        '7' => __('Maths'),
        '8' => __('Science')            
    )
);

我希望它改变成的风格：

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
    <div class="panel panel-default">
        <div class="panel-heading" role="tab" id="headingOne">
            <h4 class="panel-title">
                <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                    <legend>Primary</legend>
                </a>
            </h4>
        </div>
        <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
            <div class="panel-body">
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="1" id="SubjectSubject1" /><label for="SubjectSubject1">General</label></div>
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="2" id="SubjectSubject2" /><label for="SubjectSubject2">English</label></div>
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="3" id="SubjectSubject3" /><label for="SubjectSubject3">Maths</label></div>
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="4" id="SubjectSubject4" /><label for="SubjectSubject4">Science</label></div>                       
            </div>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading" role="tab" id="headingTwo">
            <h4 class="panel-title">
                <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                    <legend>Secondary</legend>
                </a>
            </h4>
        </div>
        <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
            <div class="panel-body">
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="5" id="SubjectSubject5" /><label for="SubjectSubject5">General</label></div>
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="6" id="SubjectSubject6" /><label for="SubjectSubject6">English</label></div>
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="7" id="SubjectSubject7" /><label for="SubjectSubject7">Maths</label></div>
                <div class="checkbox-inline no_indent"><input type="checkbox" name="data[Subject][Subject][]" value="8" id="SubjectSubject8" /><label for="SubjectSubject8">Science</label></div>
            </div>
        </div>
    </div>
</div>

我做了一些搜索，但我找不到修改每个opt组标记的方法..不确定是否真的有办法做到这一点？

Answer 1

您始终可以使用自定义帮助程序为默认帮助程序设置别名。这种方式在调用Form:input时你可以拥有自己的功能来创建你的手风琴。

换句话说，在文件夹View\Helpers内，您可以创建一个名为BootstrapFormHelper

的类

然后在这堂课中你写

App::uses('FormHelper', 'View/Helper');

class BootstrapFormHelper extends FormHelper {

    /**
     * input method
     *
     * @param string $fieldName
     * @param array $options
     */
    public function input($fieldName, $options = array()) {
        if(isset($options['class'] && issset($options['class']['checkbox-inline']){
            //put your code to create the Accordion
        }
        return parent::input($fieldName, $options);
    }
}

你的AppController内部：

public $helpers = array(
    'Form' => array(
        'className' => 'BootstrapForm'
    ),
)

现在，当您致电Form::input时，将执行的方法将是BootstrapForm::input()的方法

请参阅此处的最后一段http://book.cakephp.org/2.0/en/views/helpers.html#using-and-configuring-helpers。希望它有所帮助。

修改

一个例子可能是：

public function input($fieldName, $options = array()) { if( isset($options['type']) && $options['type'] == 'select') && isset($options['multiple']) && $options['multiple'] == 'checkbox') && isset($options['class'] && issset($options['class']['checkbox-inline']) ) { return $this->inputAccordionCheckboxes($fieldname, $options); } return parent::input($fieldName, $options); } private function inputAccordionCheckboxes($fieldname, $options){ $chkOptions = $options['options']; $string = ''; $string = 'Write the panel opening tags and the legend you need'; foreach($chkOptions as $field => $options){ $string .= 'open the tags for accordion'; $string .= 'create your checkboxes with an parent::input function according to your needs'; $string .= 'close the tags for accordion'; } $string = 'Write the close tags for the panel'; return $string; }

不知道我的逻辑是否会帮助你或者让你更加困惑。

带有Bootstrap手风琴的CakePHP Formhelper

1 个答案: