2016-03-04 4 views
0

Я пытаюсь создать приложение для рельсов. У меня есть куча объектов «урока», которые я просматриваю, и я хотел бы иметь их в трех трех разных столбцах. Всего 21 объект, поэтому 7 в каждом столбце.Отображение элементов в столбцах (Rails)

<% lessons.each do |lesson| %> 

    <% status = user.lesson_user_status.where(lesson: lesson)[0].status %> 

    <% if status != "completed" && lesson.title != "Pre/Post Quiz"%> 
     <% if(!hasSeenAvailableLesson) %> 
      <%= link_to lesson.title, show_lesson_path(lesson), class: "btn btn-default #{status}", "data-toggle"=> "tooltip", title: lesson.description %> 
      <% hasSeenAvailableLesson = true %> 
     <% else %> 
      <%= link_to lesson.title, '', class: "btn btn-default blocked #{status}", "data-toggle"=> "tooltip", title: lesson.description %> 
     <% end %> 

     <br> 
     <br> 
    <% end %> 

<% end %> 

Я думаю, что использование столбцов Bootstrap было бы хорошей идеей, но я не знаю, как реализовать его здесь. Как я могу сказать программе иметь 7 уроков в каждом столбце?

ответ

0

Проверьте эту идею!

И измените, как хотите.

Bootstrap grid examples

<div class="col-md-12"> #(12/4 = 3 (for columns you want)) 
<% ctr = 0 %> 

# iteration starts here 
<% lessons.each do |lesson| %> 

    <% if ctr == 0 || ctr == 3 %> 
    # new column to make 
    <div class="col-md-4"> 
    # insert data here 
    .... 
    # return ctr to 0 (for checking another count) 
    <% if ctr == 3 %> 
     <% ctr = 0 %> 
    <% end %> 
    # or <% if ctr == 3 then ctr = 0 %> 
    <% else %> 
    # insert data ONLY (DON'T CREATE NEW COLUMN) 
    ..... 
    # closing of <div> 
    </div> 
    <% end %> 

    <% ctr += 1%> 
<% end %> 
# iteration ends here 
</div> 
Смежные вопросы