$this->Html->css with inline=false doesn't work

1.9k Views Asked by At

I am defining a css block inside a view with inline=false. In the layout I try to fetch this block. But that doesn't work. I think the problem explains itself through the following code. Here is my view:

<script type="text/javascript">
$(function() {$(".datepicker").datepicker({
   numberOfMonths: 3,
   showButtonPanel: false}
   );});
</script>
<?php $this->Html->script(array('jquery-1.10.1.min', 'jquery-ui', 'jquery-ui-datepicker-de'), array('inline' => false));
      $this->Html->css('jquery-ui.css', array('inline' => false)); ?>

<div class="schooltimes form">
<?php echo $this->Form->create('Schooltime'); ?>
    <fieldset>
        <legend><?php echo 'Schulunterrichtstermin hinzufügen'; ?></legend>
        <?php
             echo $this->Form->input('dateinput', array('class'=>'datepicker', 'type'=>'text', 'label' => 'Datum des nächsten Schulunterrichtstermins'));
             echo $this->Form->input('timeinput', array('type' => 'text', 'label' => 'Uhrzeit des Unterrichtsendes im Format HH:MM'));
             echo $this->Form->input('school', array('type'=>'text', 'label'=>'Schule / Universität / Fachhochschule / sonstige Bildungseinrichtung'));
             echo $this->Form->input('grade', array('type'=>'text', 'label'=>'Klasse / Stufe / Semester'));
             echo $this->Form->input('teacher', array('type'=>'text', 'label'=>'Lehrer / Dozent'));
             echo $this->Form->input('subject', array('type'=>'text', 'label'=>'Fach / Kurs'));
             echo $this->Form->input('book', array('type'=>'text', 'label'=>'Schulbuch / Skript / Basislektüre'));
             echo $this->Form->input('inter', array('type' => 'select', 'label' => 'Rhythmus', 'options' => array('P1W' => 'wöchentlich', 'P2W' => '2-wöchentlich')));
        ?>
    </fieldset>
<?php echo $this->Form->end(array('label' => 'Speichern')); ?>
</div>

and this is the layout:

<!DOCTYPE html>
<html>
<head>
    <?php echo $this->Html->charset(); ?>
    <title>
        <?php echo 'Kundenservice' ?>:
        <?php echo $title_for_layout; ?>
    </title>

    <?php
       echo $this->Html->meta('icon');
       echo $this->fetch('meta');
       echo $this->fetch('css');  // doesn't work
       echo $this->fetch('script');  // works fine
    ?>
</head>
<body>...

this is the result:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Kundenservice: Schooltimes</title>

    <link href="/kundenservice/favicon.ico" type="image/x-icon" rel="icon" /><link href="/kundenservice/favicon.ico" type="image/x-icon" rel="shortcut icon" /><link rel="stylesheet" type="text/css" href="/kundenservice/css/cake.generic.css" /><script type="text/javascript" src="/kundenservice/js/jquery-1.10.1.min.js"></script><script type="text/javascript" src="/kundenservice/js/jquery-ui.js"></script><script type="text/javascript" src="/kundenservice/js/jquery-ui-datepicker-de.js"></script></head>

cake php fetches the script block correctly but completely ignores the css block. Any help would be much appreciated.

2

There are 2 best solutions below

1
On BEST ANSWER

I'm using 2.3.0. If you take a look at HtmlHelper css function, it looks like:

public function css($path, $rel = null, $options = array())

So, the documentation at cakephp website is missing mentioning the $rel parameter (http://book.cakephp.org/2.0/en/core-libraries/helpers/html.html).

Just change your call to something like:

$this->Html->css('jquery-ui.css',null, array('inline' => false)); 

And everything will work fine.

1
On

Try this::

<?php $this->Html->script(array('jquery-1.10.1.min', 'jquery-ui', 'jquery-ui-datepicker-de'), array('block' => 'script'));
      $this->Html->css('jquery-ui.css', array('block' => 'css')); ?>

Try to use the custom block. It is better way I think.

// in your view
$this->Html->script('jsfile', array('block' => 'scriptBottom'));

// in your layout
echo $this->fetch('scriptBottom');