CakePHP & Twitter Bootstrap CSS button icons - html

I have this code;
<?php echo $this->Form->postLink(__('Delete'),
array('action' => 'delete', $homepage['Homepage']['ContentID']),
array('class'=>'btn icon-plus'),
__('Are you sure you want to delete # %s?', $homepage['Homepage']['ContentID'])); ?>
Where it displays the text 'Delete' I would like to put the trashcan icon from the twitter bootstrap css package. However when I do;
<?php echo $this->Form->postLink(__('<i class="icon-trash"></i>')....
It only displays the html rather than grabbing the icon.
Can anyone explain why its doing this and how I can resolve it?

Add 'escape' => false option to the third param.
<?php echo $this->Form->postLink(__('Delete'),
array('action' => 'delete', $homepage['Homepage']['ContentID']),
array('class'=>'btn icon-plus', 'escape' => false),
__('Are you sure you want to delete # %s?', $homepage['Homepage']['ContentID'])); ?>

Check to make sure the path to the "glyphicons-halflings.png" file is correct. By default, this image should be located in a directory named "img" that is at the same level as the folder containing the bootstrap.css file (named "css" in the default download).
css/bootstrap.css
img/glyphicons-halflings.png
Check your error console to see if there are any requested files not found.

Related

Yii2 delete action is called twice when the link is clicked

The view that is rendered from the controller has a Pjax begin and end tags:
Pjax::begin([
'id' => 'pjax-questions-list',
'enablePushState' => false,
'clientOptions' => [
'method' => 'get'
],
]);
Inside the Pjax it renders two nested views:
<div class="body">
<?php
echo $this->render('_questions_search', ['model' => $searchModel, ' questionary' => $questionary]);
echo $this->render('_questions_list', ['dataProvider' => $dataProvider, 'model' => $searchModel]);
?>
</div>
Inside the nested view there is a delete question link:
<li>
<a class="waves-effect waves-block" data-pjax="0"
href="<?= Url::to(['question/delete', 'id' => $model->id]) ?>">Delete</a>
</li>
When that link is clicked, the delete action method is called twice. Moreover, this issue is hard to notice when the Pjax is outside of the view that contains the link (i.e. nested views). Because of this issue the redirect after successfull delete doesn't work and instead a 404 not found error is found (tries to delete the same id twice).
How can i fix the double redirect?
You can fix the double redirect by adding the following attribute to your link which is located inside Pjax:
data-pjax="0"
In my case i reused the nested view by deleting the grid view and replacing it with ul with links, and of course forgot to remove the unneeded Pjax in the outer view. After that the issue appeared. It was hard to notice that it was calling the action method twice.

Yii2. Represent an image.

I use Yii2 and Windows 10 OS. My images are stored in #root/uploads folder.
I am able to upload them via alias like this:
in config\bootstrap.php:
Yii::setAlias('#root', realpath(dirname(__FILE__).'/../../'));
in upload method:
$this->imageFile->saveAs(Yii::getAlias('#root') .'/uploads/' . $this->imageFile->baseName . '.' . $this->imageFile->extension);
Then I try to see an image in view:
<?php echo Html::img('../../uploads/ring.jpg',['class' => 'img-center', 'width'=>150, 'heigth'=>150, 'alt'=>'no image']) ?>
But it is not there... What I missed? Is there some restrictions for the folder?
do the same with getAlias
<?php echo Html::img( Yii::getAlias('#root') .'/uploads/ring.jpg',
['class' => 'img-center', 'width'=>150, 'heigth'=>150, 'alt'=>'no image']) ?>
for debugging you can try creating a proper alias for your uploads directory
Yii::setAlias('#uploads', 'your_absolute_path_uploads');
var_dump( Url::to('#uploads') );
<?php echo Html::img( Yii::getAlias('#uploads') .'/ring.jpg',
['class' => 'img-center', 'width'=>150, 'heigth'=>150, 'alt'=>'no image']) ?>
if don't work ..be sure of your web server / apache / htaccess / redir configuration.
try using
use yii\helpers\Url;
<?php echo Html::img( Url::to['../../uploads/ring.jpg'],
['class' => 'img-center', 'width'=>150, 'heigth'=>150, 'alt'=>'no image']) ?>
Or set a proper absolute alias. This a sample for www.oracle.com .. but you should adapt to your need
Yii::setAlias('#oracle', 'http://www.oracle.com');
echo Url::to('#oracle'); // get URL from alias http://www.bsourcecode.com

yii2 include html code inside Html::button

I need to include some html code inside Html::button in yii2. According to the Class yii\helpers\BaseHtml i can pass html code to $content. Please, correct me if i am wrong. So i wrote:
<?= Html::button{'<div class=\'row\'></div>,[]); ?>
and it works. But what if the code i want to insert is big? How do i include big code with less pain?
Thank you very much.
You could use views and renderPartial
e.g. in your view
<?php
$html = $this->context->renderPartial('sub_view', [
'attribute' => 'test',
]);
echo Html::button($html,[]);
?>
and in your subview your static html or dynamic code
<h1>static html code<h1>
<div>
<?php
echo $attribute
?>
</div>

Cakephp : inserting Image in view with class and alt tag

I tried to render something like this using html helper:
<img src="url/to/image.png" alt="alt-tag" />
I write this in my .ctp file:
<?php
echo $this->Html->link($this->Html->image("image.png", array("alt" => "alt-tag")),"#", array('class' => 'some-class'));
?>
But in browser, image was not displaying but simple plain text :
<img src="/url/to/image.png" alt="alt-tag" />
I did inspect element, where everything look as what I wanted to render. I tried to edit it live, so I selected edit as html option in inspect element. I surprised to see following code:
<img src="/url/to/image.png" alt="alt-tag" />
Please not that insted of < and > it was < and >.
I couldn't figure out what is the problem. (I am new to cakephp).
Use escape attribute to False
ex:
echo $this->Html->link($this->Html->image("image.png", array("alt" => "alt-tag")),"#", array('class' => 'some-class', 'escape' => false));

CakePHP Span Tag within Anchor Tag

I'm trying to have CakePHP output a link that looks like this:
<a href="/foo/bar" class="some other classes">
<span class="icon new"></span>FooBar</a>
So I use the following code in my view
<?php
echo $this->Html->link(
$this->Html->tag('span', null, array('class' => 'icon new')) . "FooBar",
array('controller' => 'foo', 'action' => 'bar'),
array('class' => 'some other classes', 'escape' => false)
);
?>
However CakePHP outputs the following:
<a href="/foo/bar" class="some other classes">
<span class="icon new">FooBar</span></a>
Which breaks my design. How can I get CakePHP to append "FooBar" after the <span> tags?
EDIT: Its also worth mentioning that I know a <span> tags shouldn't be within an anchor tag usually, but in the case its a must.
You need to use an empty string in stead of null as the text for the span, then your code will work as expected.
Looking at the source code of the HtmlHelper, null is treated as a 'special' value, causing only the opening tag of the span to be created. You can see this in this line:
https://github.com/cakephp/cakephp/blob/2.3.2/lib/Cake/View/Helper/HtmlHelper.php#L906
Change your code to this and it should work;
echo $this->Html->link(
$this->Html->tag('span', '', array('class' => 'icon new')) . "FooBar",
array('controller' => 'foo', 'action' => 'bar'),
array('class' => 'some other classes', 'escape' => false)
);
Additional explanation of the closing </span>
A bit of explanation, for those who wonder:
The closing </span> in your example is actually not present in the output generated by CakePHP, but automatically 'added' by your browser. If you view the source of the HTML in your browser, you'll see that this is what is actually in your HTML:
<a href="/foo/bar" class="some other classes">
<span class="icon new">FooBar</a>
As you can see, no closing 'span'
Because the <span> is not closed, the browser will try to correct this error and automatically assumes that you 'forgot' to close it. Therefor it will add a closing </span> before the next tag it finds (in this case the closing </a>).
The 'inspector' in your browser will always show the HTML that the browser uses to render the output. This includes automatic corrections made by the browser and dynamically generated elements (e.g. Elements added via JavaScript).
To check the output of your PHP scripts, always view the source, not the inspector
In this situation, I've avoided the CakePHP helpers entirely because the markup becomes really messy and cannot take advantage of autocomplete or validation within your IDE.
I usually do something like this:
<span class="icon-new"></span>Foobar
This looks a little overkill for me. Just do this:
echo $this->Html->link(
"<span class="icon new"></span> FooBar",
array('controller' => 'foo', 'action' => 'bar'),
array('class' => 'some other classes', 'escape' => false)
);
I've been using CakePHP for 4 years and I don't see the benefit of using tag in this instance.
Would you be able to use regular PHP in this case?
I am thinking you could do it like this:
<?PHP
echo('<span class="' . 'icon new' . '"></span>' . 'FooBar' . '')
?>