Laravel，在选择下拉列表中的选项中添加不同的html属性 [英] Laravel, add different html attributes to the options in select drop-down Lists

问题描述

是否有一种方法可以将HTML属性添加到使用刀片Form::select()的下拉选择中的选项中?

Is there a way to add HTML attributes to an option in a dropdown select with blade Form::select()?

好吧，因为我需要这样的东西:(向option标签添加不同的CSS类)

Well, because I need something like this: (add different CSS classes to the option tags)

<select id="colors" name="colors">
  <option value="1" class="blue">blue</option>
  <option value="2" class="red">red</option>
  <option value="3" class="yellow">yellow</option>
</select>

更新(CSS类名称不应与文本名称相同.css类来自数据库中的表.)

UPDATE (The CSS class name should not be the same as the text name. The css classes comes from a table in the database.)

<select id="colors" name="colors">
  <option value="1" class="blue">colors-blue</option>
  <option value="2" class="red">something-red</option>
  <option value="3" class="yellow">banana is yellow</option>
</select>

如果只是添加到所有这些选项中的一个CSS类，我可以简单地使用jQuery来实现.但是我需要添加多个.

If it was just one CSS class to add to all those options, I could simply do that with jQuery. But I need to add more than one.

PS:我将类名存储在数据库的表中.

PS: I have the classes name stored in an table from the database.

在文档中，我看不到任何亮光.我也曾看过API.

From the docs, I can't see no light. I've looked to the API also.

更新2 (提供了一些代码的详细信息)

Update 2 (Giving some more details of the code)

// In my create view I have this:
{{ Form::select( 'colored_stuffs', $colorsList, null, ['id'=>'colored_stuffs'] ) }}

// The $colorsList generate an array in the ColorsController@create
public function getCreate()
  {
    $colorsList      = $this->colors->listAll();
  }

// listAll() is defined here is this repository
public function listAll()
  {
      $colors = $this->model->lists('name', 'id', 'color_class');

      return $colors;
  }

// the HTML optput of the create view it's this
<select id="colored_stuffs" name="colored_stuffs">
  <option value="1">Red is used to alert something</option>
  <option value="2">A banana is yellow</option>
  <option value="3">Sorry no color here</option>
</select>

// But I want this
<select id="colored_stuffs" name="colored_stuffs">
  <option value="1" class="red">Red is used to alert something</option>
  <option value="2" class="light-yellow">A banana is yellow</option>
  <option value="3" class="black">Sorry no color here</option>
</select>

推荐答案

默认的Form::select()帮助器将不支持您所请求的内容，但是您可以使用

The default Form::select() helper will does not support what you're requesting, but you can add additional Form helpers using a Macro:

Form::macro('fancySelect', function($name, $list = array(), $selected = null, $options = array())
{
    $selected = $this->getValueAttribute($name, $selected);

    $options['id'] = $this->getIdAttribute($name, $options);

    if ( ! isset($options['name'])) $options['name'] = $name;

    $html = array();

    foreach ($list as $list_el)
    {
        $selectedAttribute = $this->getSelectedValue($list_el['value'], $selected);
        $option_attr = array('value' => e($list_el['value']), 'selected' => $selectedAttribute, 'class' => $list_el['class']);
        $html[] = '<option'.$this->html->attributes($option_attr).'>'.e($list_el['display']).'</option>';
    }

    $options = $this->html->attributes($options);

    $list = implode('', $html);

    return "<select{$options}>{$list}</select>";
});

您可以根据需要将此新方法与其他class一起使用:

You can use this new method with the additional class as required:

$options = [
    [
        'value' => 'value-1',
        'display' => 'display-1',
        'class' => 'class-1'
    ],
    [
        'value' => 'value-2',
        'display' => 'display-2',
        'class' => 'class-2'
    ],
    [
        'value' => 'value-3',
        'display' => 'display-3',
        'class' => 'class-3'
    ],
];
echo Form::fancySelect('fancy-select', $options);

这篇关于Laravel，在选择下拉列表中的选项中添加不同的html属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！