0

CakePHP2.x 用のTwitterBootstrap プラグインを使用しています。また、水平フォームとネストされたインライン フォームの組み合わせが機能しません。

私のコードの一部:

<?php
    echo $this->Form->create('Event', array('class' => 'form-horizontal'));
    echo $this->Form->input('Event.short_name',array(
        'label' => 'Short name', 
        'type' => 'text', 
        'class' => 'span5'
    ));
?>
<div class="control-group">
    <div class="control-label">Date & Time</div>
    <div class="controls form-inline">
        <div class=" input-append">
            <?php 
                echo $this->Form->input('Event.start_date', array(
                    'label' => false,
                    'type' => 'text', 
                    'class' => 'span2 start_date', 
                    'after' => '<span class="add-on datetime"><span class="icon-calendar"></span></span>'
                ));

                echo $this->Form->input('Event.end_date', array(
                    'label' => false,
                    'type' => 'text', 
                    'class' => 'span2 end_date', 
                    'after' => '<span class="add-on"><span class="icon-calendar"></span></span>'
                ));
            ?>
        </div>
    </div>
</div>

上記の例では、次のことが起こります。 捕獲

そして生成されたhtml

<div class="control-group">
    <div class="control-label">Date & Time</div>
    <div class="controls form-inline">
        <div class=" input-append">
            <div class="control-group">
                <div class="controls">
                    <input name="data[Event][start_date]" class="span2 start_date" type="text" value="2013-06-15" id="EventStartDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span>
                </div>
            </div>
            <div class="control-group">
                <div class="controls">
                    <input name="data[Event][end_date]" class="span2 end_date" type="text" value="2013-06-22" id="EventEndDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span>
                </div>
            </div>
        </div>
    </div>
</div>

'div' -> false を 2 つの日付フォーム フィールドに追加すると、インラインに移動しますが、パディングなどはなくなります。 捕獲

そして生成されたhtml

<div class="control-group">
    <div class="control-label">Date & Time</div>
    <div class="controls form-inline">
        <div class=" input-append">
            <input name="data[Event][start_date]" class="span2 start_date" type="text" value="2013-06-15" id="EventStartDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span>
            <input name="data[Event][end_date]" class="span2 end_date" type="text" value="2013-06-22" id="EventEndDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span>
        </div>
    </div>
</div>

これは、すべてのフォーム フィールドがコントロールの div に配置されていることが原因だと思います。これを解決する方法を知っている人はいますか?

プラグインに関係していると思うので、これをGitHub ページにも問題として投稿しましたが、誰かが一時的な回避策を知っていることを願っています。

4

2 に答える 2

0

多分これはうまくいくかもしれません。以前使っていましたが、こんな感じです。

ここに画像の説明を入力

<?php echo $this->Form->create('Event', array(
'class' => 'form-horizontal',
'inputDefaults' => array(
    'format' => array('before', 'label', 'between', 'input', 'error', 'after'),
    'div' => array('class' => 'control-group'),
    'label' => array('class' => 'control-label'),
    'between' => '<div class="controls">',
    'after' => '</div>',
    'error' => array('attributes' => array(
            'wrap' => 'span', 'class' => 'help-inline'
    )),
)));?>
<fieldset>
   <?php echo $this->Form->input('Event.start_date', array(
        'label' => array('class' => 'control-label',
            'text' => 'start date'),
    ));?>
</fieldset>
<?php echo $this->Form->end();?>
于 2013-06-22T09:13:50.690 に答える