отобразить список радиоблоков в нескольких столбцах - PullRequest
Новая
       12

отобразить список радиоблоков в нескольких столбцах

0 голосов
/ 05 января 2012

У меня есть цикл php, который перечисляет 50 радиобоксов.Я хочу поставить 10 радиобоксов в каждой колонке.Я попытался:

div style = "переполнение: скрыто; пробел: nowrap; float: left; ширина: 160px;">

генерирующий код: 

 {php} $j=0; {/php} 
                {foreach from=$genreLists item=genreList key = genre_key}
                {if $genre_key <= 250}
                div id="genrecheck_{$genreList}">
              input name="genre[]" type="checkbox" id="genre[]" value="{$genreList}" {section  name = rows loop = $smarty.request.genre} {if $genreList ==  $smarty.request.genre[rows]} checked {/if}{/section} onClick="getval(this,'genrecheck_{$genreList}');">
                div id="genre_{$genre_key}" style="display:none;">{$genreList}/div>div id="genre1_{$genre_key}" style="display:inline;">{$genreList} /div>
                /div>
                {php} $j++; if($j%5==0) { echo "
                "; $j=0; } {/php} {/if}{/foreach}

кажется, что он не работает.Какие-либо предложения?пожалуйста, обратите внимание: радиоблоки отображаются с помощью php-петли.

Ответы [ 2 ]

1 голос
/ 05 января 2012 
<div class="Row">
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
  <input type="radio" name="Row1" />
</div>
<div class="Row">
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
  <input type="radio" name="Row2" />
</div>
<div class="Row">
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
  <input type="radio" name="Row3" />
</div>
<div class="Row">
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
  <input type="radio" name="Row4" />
</div>
<div class="Row">
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
  <input type="radio" name="Row5" />
</div>
1 голос
/ 05 января 2012

Я обнаружил, что лучший способ справиться с разбиением флажков на столбцы - это с помощью функции array_chunk () разделить ваш массив на равные подмассивы, а затем использовать двойной цикл foreach для визуализации столбцов.

http://php.net/manual/en/function.array-chunk.php

echo '<div class="container">';
foreach(array_chunk($genreLists,5) as $row_value)
{
  echo '<div class="row">';
  foreach($row_value as $cell_key => $cell_value)
  {
    echo '<div class="cell">';
    //echo your checkbox html here
    echo '</div>'; // close cell
  }
  echo '</div>'; // close row
}
echo '</div>'; // close container

Та же концепция может быть реализована с циклом smarty {foreach}, если вы выполняете array_chunk перед назначением его для механизма шаблонов.На самом деле в smarty {$ var | array_chunk: 5} должен работать как модификатор

Если вы хотите, чтобы флажки были представлены вертикально, используйте эту функцию вместо: 

/* ----------[ func ARRAY CHUNK VERTICAL ]----------
A sister to array_chunk, but instead of horizontal, split
the data vertical
*/
function array_chunk_vertical($array = null,$cols = 3, $pad = array(null))
{
  if (is_array($array) == true and !empty($array))
  {
    // total items in the array
    $count = count($array);
    // if count is empty
    if(empty($count))
    {
      return false;
    }
    // if cols is some how still empty
    if(empty($cols))
    {
      $cols = 3;
    }
    // count the number of vertical rows
    $rows = ceil($count/$cols);
    // group the array into colums
    $array = array_chunk($array,$rows);
    // if the array is less that the number of cols required
    // pad it to ensure length remains constant
    if (count($array) < $cols)
    {
      $array = array_pad($array,$cols,$pad);
    }
    // pad the array with a null character as required
    foreach($array as $key => $value)
    {
      $array[$key] = array_pad($value,$rows,null);
    }
    // now inverse the rows with the cols
    foreach($array as $key => $value)
    {
      foreach($value as $sub_key => $sub_value)
      {
        $output[$sub_key][$key] = $sub_value;
      }
    }
    // spit it out
    return $output;
  }
  // oops
  return $array;
}
...