Question

我正在关注cakephp网站上的博客教程： https://book.cakephp.org/2.0/en/tutorials-and-examples/blog/part-two.html

我正在尝试从编辑页面添加取消按钮，并希望内联到表单的保存按钮但是当我在表单中添加取消时蛋糕中的Form-＆gt; end（）函数将我的取消作为保存提交，所以我也尝试在Form-＆gt; end（）之后添加Cancel按钮，将它放在结束div之前，但现在按钮现在已经堆叠在彼此之上。有没有办法在表单中重定向取消而不提交编辑后的更改？

代码如下：

<div class="container">
    <h1>Edit Post</h1>
    <?php
        echo $this->Form->create('Post');
        echo $this->Form->input('article_title', array('type' => 'text','maxlength' =>'100', 'id'=>'ArticleHeader',"placeholder"=>"Article Header (100 char)", 'class'=>'centertext'));
        echo $this->Form->input('article_link', array( 'type' => 'url','maxlength' =>'200', 'id'=>'ArticleLink',"placeholder"=>"Article Link (200 char)", 'class'=>'centertext'));
        echo $this->Form->input('id', array('type' => 'hidden'));

        echo $this->Form->button('Save', array('type' => 'submit', 'class'=>'button disabled', 'id'=>'SaveEdit'), array('inline' => true));
        echo "\r\n";?>
        <button class='button' onclick="window.location.href='<?php echo Router::url(array('controller'=>'Posts',
                   'action'=>'index' ),array('inline' => true))?>'">Cancel</button>
    <?php
        echo $this->Form->end();
    ?>
</div>

Answer 1

CakePHP FormHelper将输入和相应的标签包装在div中。因此，您不会获得内联元素。如果您想使用Formhelper创建输入，则必须通过'div' => false禁用div作为输入选项并手动包装取消/提交输入。

如果您只想重置表单并留在页面上，可以使用'type' => 'reset'输入。如果要返回索引页

<div class="submit">
    <?php
    // Reset
    echo $this->Form->input('Reset', array(
        'label' => false,
        'type' => 'reset',
        'div' => false
    ));

    // Cancel
    echo $this->Html->link(
        __('Cancel'),
        Router::url(array('controller' => 'Posts', 'action' => 'index')),
        array('class' => 'button')
    );

    // Submit and closing Form Tag
    echo $this->Form->end(array(
        'label' => __('Submit'),
        'div' => false
    ));
    ?>
</div>

由于Button Tag本身没有href attribute，因此您必须使用链接。让此链接指向您的索引操作并为其指定'class' => 'button'。在你的CSS中你可以像它那样设置样式（我从cake.generic.css中获取它）：

input[type=submit], input[type=reset], .button {
    display: inline;
    font-size: 110%;
    width: auto;
}

form .submit input[type=reset], .button {
    background:#FFDACC;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFDACC), to(#9E2424));
    background-image: -webkit-linear-gradient(top, #FFDACC, #9E2424);
    background-image: -moz-linear-gradient(top, #FFDACC, #9E2424);
    border-color: #2d6324;
    color: #fff;
    text-shadow: rgba(0, 0, 0, 0.5) 0 -1px 0;
    padding: 8px 10px;
}
form .submit input[type=reset]:hover, .button {
    background: #9E2424;
}

有关更多选项，请参阅CakePHP HtmlHelper和FormHelper。

Cakephp 2.X有按钮内联

1 个答案: