2017-10-23 16 views
0

私はPHP連想配列のリストを持っています。リスト内の各連想配列は色です。それは、16進コード、ラベル、および家族を持っています。家族は基本的な色(青、赤、緑など)になり、ラベルはより特定の色になります。青い家庭のためには、水中海洋、靑炭、空色があります。PHPでHTMLコンテナを区切っています。連想配列キー

私のテンプレートでは、基本的な2つの部分からなるコンテナを作成し、上半分は16進色、下半分は16進数のコードとラベル名で記述します。私は各アイテムを家族のために1つの大きな容器に入れておきたい。たとえば、海洋、淡水、および空の青はヘッダ「青」で1つの容器に入れられ、ライム、森、および黄緑がヘッダー「緑」のコンテナにも存在します。私は連想配列のリストを事前にファミリフィールドで並べるので、実際に見つけ出す必要があるのは、ファミリの値が変わったときに新しい 'ファミリコンテナ'を作成する方法をHTMLに伝えることです。

私はPython開発者であり、すべてのものPHPには新しいものです。家族による

PHP HTML

<?php 

$allColors = array(
    '0' => array(
    "id"=> "1", 
    "family"=> "blue", 
    "name"=> "ariel blue", 
    "hex"=> "#339FFF"), 

'3' => array(
    "id"=> "3", 
    "family"=> "green", 
    "name"=> "forest", 
    "hex"=> "#FAFF33"), 

'1' => array(
    "id"=> "2", 
    "family"=> "blue", 
    "name"=> "aqua marine", 
    "hex"=> "#339FFF"), 

'4' => array(
    "id"=> "4", 
    "family"=> "green", 
    "name"=> "lime", 
    "hex"=> "#FAFF33"), 

'2' => array(
    "id"=> "5", 
    "family"=> "blue", 
    "name"=> "teal", 
    "hex"=> "#339FFF"), 

'5' => array(
    "id"=> "6", 
    "family"=> "green", 
    "name"=> "yellow-green", 
    "hex"=> "#FAFF33") 
); 

array_multisort(array_column($allColors, 'family') , SORT_DESC, $allColors); 

$key_list = ["blue", "green"] 

?> 


<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title></title> 

    <link rel="stylesheet" type="text/css" href="main.css"> 
    </head> 

<body> 

<?php 
    $currFamily = $allColors[0]["family"] 
?> 

    <?php foreach($allColors as $key => $value): ?> 

    if ($value["family"] != $currFamily) { 
     <div id="family-container" style="border: 1px solid <?php echo $value["family"]; ?>; background-color: $currFamily;"> 
    } 

     <h2>Blue <?php echo $currFamily; ?></h2> 

     <div class="child-container" style="margin-right: 20px; width: 100px; height: 150px; border: 1px solid black; float: left;"> 
      <div style="width: 100%; height: 100px; float: right; border-bottom: 1px solid black; background: <?php echo $value["hex"]; ?>;"></div> 
      <div style="width: 100%; height: 50px; float: right;"> 
      <?php echo $value["name"]; ?>; 
      <?php echo $value["hex"]; ?>; 
      </div> 
     </div> 

     if ($value["family"] != $currFamily) { 
      </div> 

      $currFamily = $value["family"] 
     } 

    <?php endforeach; ?> 

</body> 
</html> 

enter image description here

答えて

1

あなたはできるグループあなたの色、あなたは

<?php 

$allColors = []; 
$arGroupedByFamily = []; 
foreach ($allColors as $color) { 
    $arGroupedByFamily[$color['family']][] = $color; 
} 

?> 
<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title></title> 
     <link rel="stylesheet" type="text/css" href="main.css"> 
    </head> 

    <body> 
     <?php foreach ($arGroupedByFamily as $key => $family): ?> 
      <div id="family-container" style="border: 1px solid <?php echo $key; ?>; background-color: $currFamily;"> 
       <?php foreach ($family as $color): ?> 
        <h2><?php echo $color['name'];?> <?php echo $key; ?></h2> 
        <div class="child-container" style="margin-right: 20px; width: 100px; height: 150px; border: 1px solid black; float: left;"> 
         <div style="width: 100%; height: 100px; float: right; border-bottom: 1px solid black; background: <?php echo $color["hex"]; ?>;"></div> 
         <div style="width: 100%; height: 50px; float: right;"> 
          <?php echo $color["name"]; ?>; 
          <?php echo $color["hex"]; ?>; 
         </div> 
        </div> 
       <?php endforeach; ?> 
      </div> 
     <?php endforeach; ?> 
    </body> 
</html> 
以下のように読めるビューを持っています
関連する問題