Contact | Programmeertips
De items moeten van boven naar beneden toegevoegd worden.
Voorbeeld:
Item 1    Item 4     Item 7
Item 2    Item 5     Item 8
Item 3    Item 6


Je zou denken dat een tabel de oplossing is. Dat is het echter niet ... Een tabel wordt nl. van links naar rechts opgebouwd, dat betekent dus dat als de itemvolgorde van boven naar beneden moet lopen, je de itemvolgorde al in de array moet aanpassen voordat je ze in de tabel stopt. Dat kan wel maar is lastig.

Een andere mogelijkheid is div-jes gebruiken. (Met float:left kun je de kolommen naast elkaar plaatsen) Deze kun je wel van boven naar beneden vullen. Het enige dat je dan moet weten is welk item in een div de laatste moet zijn. Zodat je de met de volgende kolom kunt beginnen.

Ik heb de mogelijkheden op een rijtje gezet, met willekeurige aantallen items en willekeurige aantallen kolommen en toen bleek er een bepaalde regelmaat in te zitten.

Codefragment PHP:
$cnt_columns = $arr_display_options['faq_nr_columns'];
$cnt_items = count($arr_categories);       
       
foreach($arr_categories as $key => &$cat) {
  $obj_faq_question     = new FaqItem();           
    $obj_faq_question->set_faq_id($obj_repository_item->get_Item_id());
    $obj_faq_question->setCat_id($cat['cat_id']);
            
    $cat['cnt_questions']    = $obj_faq_question->find(true);
           
    if($cnt_columns == 2) {
        if(   $key == ($cnt_items - 1)/2 ) {
            $cat['column_close'] = true;
        }
    }
    if($cnt_columns == 3) {
        if(   $key == floor(($cnt_items - 1)/3) OR  $key == ($cnt_items - 1) - floor($cnt_items/3) ) {
            $cat['column_close'] = true;
        }
    }
    if($cnt_columns == 4) {
        $rest = $cnt_items % 4;
        $sec_key = ($rest > 1) ? floor(($cnt_items - 1)/4)+floor($cnt_items/4)+1 : floor(($cnt_items - 1)/4)+floor($cnt_items/4);
       
        if(   $key == floor(($cnt_items - 1)/4) OR  $key == $sec_key OR  $key == ($cnt_items - 1) - floor($cnt_items/4) ){
            $cat['column_close'] = true;
        }
    }
}

?>


Codefragment template:

Reactie *
Naam *


Divide categories in several columns


I didn't want to show several categories in one row, but divide them in columns.
That can be done with a foreach and a table, but then the categories are alphabetically ordered horizontally.
Like this:
Aaa      Bbb     Ccc      Ddd
Eee      Fff      Ggg

I don't like that. I want it to be ordered vertically. Like this:
Aaa      Ccc      Eee     Ggg
Bbb      Ddd     Fff

Reactie *
Naam *