アドミン・ジェネレータのテーマをカスタマイズ/検索フィルタ

PHP symfony

アドミンジェネレータが作成してくれる一覧画面は結構ナイスなんだけど、FireFoxで表示させると右側に表示される検索フィルタがリスト表示部分と重なってしまいます。


デフォルトのテーマとCSSをカスタマイズして、検索フィルタをリストの上部に表示させ、表示/非表示を切替えできるようにしましょう。



まず、myproj/web/sf/sf_admin/css/main.css を変更します。


検索フィルタのdivはid="sf_admin_bar"になっているので、ここのposition属性がabsoluteに設定されているのをコメントアウトします。
これでリストの上部に表示されるようになりました。

#sf_admin_container #sf_admin_bar
{
  margin-top: 8px;
  //position: absolute;
  right: 20px;
  width: 250px;
}


次に、表示/非表示のjavascriptを組込むため、テーマをカスタマイズします。

デフォルトのテーマ(C:\xampp\php\PEAR\data\symfony\generator\sfPropelAdmin)をmyproj/data/generatorの下にコピーします。

次に、myproj/data/generator/sfPropelAdmin/default を
myproj/data/generator/sfPropelAdmin/mythemeにリネームします。

それから、generator.ymlのthemeをmythemeに変更します。

generator:
  class:              sfPropelAdminGenerator
  param:
    model_class:      Hoge
    theme:            mytheme
    ・・・

これで、カスタマイズの準備ができました。

次に検索フィルタのパーシャルである _filters.php をカスタマイズします。

まず、オブジェクトの表示/非表示を切替えるJavaScriptの関数を組込みます。

<script language="JavaScript" type="text/JavaScript">
<!--
function toggleExpand(id) {
    var obj = document.getElementById(id);
    obj.style.display = ("none" == obj.style.display) ? "block" : "none";
}
//-->
</script>

それから、表示/非表示を切替えるオブジェクトにidを付け、初期値を非表示にします。

    ・・・
    <div id="sf_admin_filters" style="display:none">
    ・・・
  <ul class="sf_admin_actions" id="sf_admin_actions" style="display:none">
    ・・・

検索フィルタのタイトルに、表示/非表示を切替えるリンクを仕込みます。

    <h2><a href="javascript:;" onmousedown="toggleExpand('sf_admin_filters');toggleExpand('sf_admin_actions');">[?php echo __('filters') ?]</a></h2>


最終的には _filters.php はこんな感じになりました。

[?php use_helper('Object') ?]

<?php if ($this->getParameterValue('list.filters')): ?>
<script language="JavaScript" type="text/JavaScript">
<!--
function toggleExpand(id) {
    var obj = document.getElementById(id);
    obj.style.display = ("none" == obj.style.display) ? "block" : "none";
}
//-->
</script>

<div class="sf_admin_filters">
[?php echo form_tag('<?php echo $this->getModuleName() ?>/list', array('method' => 'get')) ?]
  <fieldset>
    <h2><a href="javascript:;" onmousedown="toggleExpand('sf_admin_filters');toggleExpand('sf_admin_actions');">[?php echo __('filters') ?]</a></h2>
    <div id="sf_admin_filters" style="display:none">
<?php foreach ($this->getColumns('list.filters') as $column): $type = $column->getCreoleType() ?>
<?php $credentials = $this->getParameterValue('list.fields.'.$column->getName().'.credentials') ?>
<?php if ($credentials): $credentials = str_replace("\n", ' ', var_export($credentials, true)) ?>
    [?php if ($sf_user->hasCredential(<?php echo $credentials ?>)): ?]
<?php endif; ?>
    <div class="form-row">
    <label for="filters_<?php echo $column->getName() ?>">[?php echo __('<?php echo str_replace("'", "\\'", $this->getParameterValue('list.fields.'.$column->getName().'.name')) ?>:') ?]</label>
    <div class="content">
    [?php echo <?php echo $this->getColumnFilterTag($column) ?> ?]
<?php if ($this->getParameterValue('list.fields.'.$column->getName().'.filter_is_empty')): ?>
    <div>[?php echo checkbox_tag('filters[<?php echo $column->getName() ?>_is_empty]', 1, isset($filters['<?php echo $column->getName() ?>_is_empty']) ? $filters['<?php echo $column->getName() ?>_is_empty'] : null) ?]&nbsp;<label for="filters_<?php echo $column->getName() ?>_is_empty">[?php echo __('is empty') ?]</label></div>
<?php endif; ?>
    </div>
    </div>
<?php if ($credentials): ?>
    [?php endif; ?]
<?php endif; ?>

    <?php endforeach; ?>

    </div>
  </fieldset>

  <ul class="sf_admin_actions" id="sf_admin_actions" style="display:none">
    <li>[?php echo button_to(__('reset'), '<?php echo $this->getModuleName() ?>/list?filter=filter', 'class=sf_admin_action_reset_filter') ?]</li>
    <li>[?php echo submit_tag(__('filter'), 'name=filter class=sf_admin_action_filter') ?]</li>
  </ul>

</form>
</div>
<?php endif; ?>