teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

必要なコードが足りなかったため、コードを追加

2020/10/12 12:44

投稿

baby_wing
baby_wing

スコア12

title CHANGED
File without changes
body CHANGED
@@ -26,6 +26,7 @@
26
26
  params.require(:q).permit(:sorts)
27
27
  end
28
28
  ```
29
+ 検索機能部分(サイドカラム)
29
30
  ```html
30
31
  <%= search_form_for @search, url: search_recipes_path do |f| %>
31
32
  <div>
@@ -51,6 +52,38 @@
51
52
  </div>
52
53
  <% end %>
53
54
  ```
55
+ メインカラム(ページネーション)
56
+ ```HTML
57
+ <div class="recipe-list jscroll">
58
+ <div class="columns is-multiline">
59
+ <% search_recipes.each do |recipe| %>
60
+ <div class="column is-3">
61
+ <div class="card">
62
+ <div class="card-image">
63
+ ~中略~
64
+ </div>
65
+ </div>
66
+ </div>
67
+ <% end %>
68
+ <%= paginate search_recipes %>
69
+ </div>
70
+ </div>
71
+ ```
72
+ サイドカラムとメインカラムをパーシャルで記載
73
+ ```HTML
74
+ <section class="section">
75
+ <div class="container">
76
+ <div class="columns is-centered">
77
+
78
+ <%= render 'recipes/サイドカラム', search_recipes: @search_recipes %>
79
+     ~中略~
80
+ <%= render 'recipes/メインカラム', search_recipes: @search_recipes %>
81
+
82
+ </div>
83
+ </div>
84
+ </div>
85
+ </section>
86
+ ```
54
87
  ```Javascript
55
88
  $(function() {
56
89
  $('.jscroll').jscroll({