CakePHP與Bootstrap（來自Twitter）

Question

我是CakePHP的新手，我想知道如何使用Boostrap從佈局與蛋糕結合的佈局。

我主要關心的是讓Form Helper繼續正常工作，因爲我認爲它使用了預先配置好的CSS類，如果我更改了默認的css，我想象Form Helper將停止工作，因爲它應該。

我看過本教程，但它似乎並不完整。
Build a PHP application using CakePHP and (twitter) Bootstrap, Part 1

有沒有人這樣做？

謝謝！ ：D

Answer 1

當前所有答案都需要更改視圖文件。

以下插件將「引導-IFY」當前的看法，並沒有任何代碼/標記的變化：

https://github.com/slywalker/TwitterBootstrap

所有你需要做的是alias的表單助手和的HtmlHelper，使現有的所有來電$this->Form & $this->Html將由插件處理。

不能比這更容易:)

Answer 2

CSS純粹是表現性的;它如何影響形式助手的工作，因爲它應該？

某些CSS驗證類可能需要重新處理，以及遇到錯誤時Cake返回的內容。

可以使用error選項很容易修改輸出：

$this->Form->input('Model.field', array('error' => array('wrap' => 'span', 
               'class' => 'boostrap-error'))); 

http://book.cakephp.org/view/1401/options-error

Answer 3

我在做同樣的事情的應用程序，我已經找到了表單元素匹配CSS類實際上相當不錯。

Twitter的引導表單元素看起來是這樣的：

<div class="clearfix"> 
    <label for="xlInput">X-Large input</label> 
    <div class="input"> 
    <input class="xlarge" id="xlInput" name="xlInput" size="30" type="text" /> 
    </div> 
</div> 

和CakePHP的表單助手產生這樣的內容：

<div class="input text"> 
    <label for="UserName">Name</label> 
    <input name="data[User][name]" type="text" value="" id="UserName" /> 
</div> 

的主要區別是在引導股利外的標籤。 FormHelper允許您設置自定義類，如array('class' => 'clearfix')。

在自舉的.input類在forms.less定義的，僅設置margin-left: 150px;到到正確的移動的輸入。如果您不使用此樣式，則可以將margin-right: 20px;添加到<label>。

在我的形式元素的代碼結束是：

echo $this->Form->input('first_name', array('div' => 'clearfix')); 

...並生成由自舉適當風格元素。

<div class="clearfix required"> 
    <label for="PersonFirstName">First Name</label> 
    <input name="data[Person][first_name]" maxlength="50" type="text" id="PersonFirstName"/> 
</div> 

我仍然在學習這兩個框架，所以可能有這個問題。希望它有幫助。

Answer 4

這似乎是你在找什麼。 https://github.com/loadsys/twitter-bootstrap-helper/branches