【问题标题】:CakePHP data-icon in select dropdown选择下拉列表中的 CakePHP 数据图标
【发布时间】:2014-04-30 11:22:26
【问题描述】:

使用 CakePHP (2.3),有没有一种方法可以轻松地将额外的参数添加到选择框的选项元素中?

使用以下代码在模板中创建选择下拉菜单时:

echo $this->Form->input('icon_id', array(
  'label' => 'Icon',
  'empty' => ' ',
  'class' => 'selectbox'
));

输出以下 HTML(正确):

<div class="input select">
  <select name="data[Link][icon_id]" class="selectbox" id="LinkIconId">
    <option value=""> </option>
    <option value="16">fa-adjust</option>
    <option value="76">fa-anchor</option>
    <option value="135">fa-archive</option>
    <option value="6">fa-arrow-cicle-o-right</option>
    <option value="10">fa-arrow-circle-o-left</option>
...

我的问题是,我可以以编程方式将属性添加到选项标签,具体来说,我想添加 data-icon 属性,其值与选项文本相同吗?例如:

    <option value="6" data-icon="fa-arrow-circle-o-right">fa-arrow-cicle-o-right</option>

我觉得我可能需要编写一个助手来执行此操作。

【问题讨论】:

    标签: cakephp formhelper


    【解决方案1】:
    $options = array(
                     1 => 'One', 
                     2 => array('name' => 'Two', 'value' => 2,  'class' => 'extra'), 
                     3 => 'Three',
                     6 => array('name' => 'Six', 'value' => 6, "data-icon"=>"fa-arrow-circle-o-right")
    );
    
    echo $this->Form->input('my_option_id',array('type' =>'select', 'options'=>$options));
    

    HTML=>

    <select name="data[my_option_id]" id="my_option_id">
      <option value="1">One</option>
      <option value="2" class="extra">Two</option>
      <option value="3">Three</option>
      <option value="6" data-icon="fa-arrow-circle-o-right" >Six</option>
    </select>
    

    【讨论】:

    • 这是个好主意。所以我做了以下事情。在我的控制器中,我将 ifind 的工作方式更改为: $icons = Hash::map($this->Link->Icon->find('list', array('order' => array('Icon.name ' => 'ASC'))), '', function($newArr) { return(array('name'=>$newArr,'data-icon'=>'fa '.$newArr)); });但我无法使用此哈希映射获取 icon_id 的值,以便我可以设置 'value'=>'...'
    • 也许...因为您在查找列表中执行此操作。你应该把它找到所有。我得看看你的表格和数据是什么样子的
    • 我已经修复了它,我在从数据库中提取后构建了自己的数组(foreach $icons as $key=>$value)......然后将它传递给现在给我的视图数据图标属性!感谢您的帮助。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-05-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多