如何添加额外空格或虚线符号以选择选项?

时间:2013-01-04 23:17:26

标签: php hierarchical

我想为我的类别制作一个选择树。这是无序列表。

function generate_menu($parent, $menu_array = null)
{
    $has_childs = false;
    foreach ($menu_array as $key => $value) {
        if ($value['parent'] == $parent) {
            if ($has_childs === false) {
                $has_childs = true;
                echo "<ul>\n";
            }
            echo '<li><a href="#">'.$value['name'].'</a>';
            generate_menu($key, $menu_array);
            echo "</li>\n";
        }
    }
    if ($has_childs === true)
        echo "</ul>\n";
}

以下是无序列表的HTML输出。

<ul>
  <li>
    Ford
    <ul>
      <li>
        Falcon
        <ul>
          <li>
            Futura
            <ul>
              <li>FPV</li>
              <li>GT</li>
              <li>F6</li>
              <li>GS</li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>
  </li>
  <li>F150</li>
  <li>Festiva</li>
</ul>

问题:如何为select option创建当前函数,结果将是这样的。

<select name="categories">
    <option value="Ford">Ford</option>
    <option value="Falcon">-Falcon</option>
    <option value="Futura">--Futura</option>
    <option value="FPV">--FPV</option>
    <option value="GT">---GT</option>
    <option value="F6">---F6</option>
    <option value="GS">---GS</option>
    <option value="F150">-F150</option>
    <option value="Festiva">-Festiva</option>
</select>

1 个答案:

答案 0 :(得分:4)

我会使用您已经存在的文本列表,将其转换为<select>元素是轻而易举的:

$list = <<<LIST
Ford
| Falcon
| | Futura
| | FPV
| | | GT
| | | F6
| | | GS
| F150
| Festiva
LIST;

echo '<select name="categories">', "\n";
foreach (explode("\n", $list) as $entry) {
    $label = strtr($entry, ['| ' => '-']);
    $value = trim($entry, ' |');
    printf("  <option value=\"%s\">%s</option>\n", htmlspecialchars($value), htmlspecialchars($label));
};
echo "</select>\n";

输出:

<select name="categories">
  <option value="Ford">Ford</option>
  <option value="Falcon">-Falcon</option>
  <option value="Futura">--Futura</option>
  <option value="FPV">--FPV</option>
  <option value="GT">---GT</option>
  <option value="F6">---F6</option>
  <option value="GS">---GS</option>
  <option value="F150">-F150</option>
  <option value="Festiva">-Festiva</option>
</select>

否则,如果您无法生成此文本列表但只能生成ul/li列表,则以相同的方式处理该HTML。

在您更新并提供HTML之后,这里是ul/li列表字符串($ul)(PHP 5.4):

echo '<select name="categories">', "\n";
foreach ((new SimpleXMLelement($ul))->xpath('//li') as $li) {
    $label = htmlspecialchars(trim($li->xpath('text()[1]')[0]));
    $level = count($li->xpath('ancestor::li'));
    printf(
        "  <option value=\"%s\">%s%s</option>\n",
        $label, str_repeat('-', $level), $label
    );
}
echo "</select>\n";

我的早期答案中更详细地说明了这是如何工作的:How can I extract structured text from an HTML list in PHP?。那个是DomDocument而不是SimpleXMLElement,但是,或多或少的主要部分是这里提供的xpath。

这一切都很好,花花公子。但是你有点错过了实际提供的示例数组 - 我现在假设:

array (
  1 => 
  array (
    'parent' => 0,
    'name' => 'Ford',
  ),
  2 => 
  array (
    'parent' => 1,
    'name' => 'Falcon',
  ),
  3 => 
  array (
    'parent' => 2,
    'name' => 'Futura',
  ),
  4 => 
  array (
    'parent' => 3,
    'name' => 'FPV',
  ),
  5 => 
  array (
    'parent' => 3,
    'name' => 'GT',
  ),
  6 => 
  array (
    'parent' => 3,
    'name' => 'F6',
  ),
  7 => 
  array (
    'parent' => 3,
    'name' => 'GS',
  ),
  8 => 
  array (
    'parent' => 0,
    'name' => 'F150',
  ),
  9 => 
  array (
    'parent' => 0,
    'name' => 'Festiva',
  ),
)

指向一些方法,该方法与您已为ul/li列表执行的操作保持一致,这是一个适用于您的数组的递归函数:

function generate_dropdown($menu_array, $parent = 0, $level = -1) {
    ++$level || print('<select name="categories">'. "\n");
    foreach ($menu_array as $key => $value) {
        if ($value['parent'] != $parent) continue;
        $label = htmlspecialchars($value['name']);
        printf("  <option value=\"%s\">%s%s</option>\n", $label, str_repeat('-', $level), $label);
        generate_dropdown($menu_array, $key, $level);
    }
    $level-- || print('</select>');
}

generate_dropdown($array);

输出:

<select name="categories">
  <option value="Ford">Ford</option>
  <option value="Falcon">-Falcon</option>
  <option value="Futura">--Futura</option>
  <option value="FPV">---FPV</option>
  <option value="GT">---GT</option>
  <option value="F6">---F6</option>
  <option value="GS">---GS</option>
  <option value="F150">F150</option>
  <option value="Festiva">Festiva</option>
</select>