I've made a list with hyper links to columns in a table called "Categories", there are 5 categories and the first set of code below makes hyperlinks to all 5.
I want to make a dropdown menu, but only show two of the categories, instead of all 5. Currently, i'm just using a href to the url, but is there some other way I can link to two columns in the "Categories" table?
Links:
<ul>
<% Category.all.each do |category| %>
<li><%= link_to category.name, items_path(category: category.name) %></li>
<% end %>
</ul>
Dropdown Menu:
<div class="container">
<div class="dropdown">
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Canon
<span class="caret"></span></button>
<ul class="dropdown-menu">
<li>Canon Cameras</li>
<li>Canon Lenses</li>
</ul>
</div>
</div>
Use take() or limit() methods to limit how many items you want to get:
<ul>
<% Category.take(2).each do |category| %>
<li><%= link_to category.name, items_path(category: category.name) %></li>
<% end %>
</ul>
With respect to your question "can link to two columns in the "Categories" table?" - Please find my comment as:
SQL Approach:
SELECT CONCAT('', "name", "title") AS "name" FROM categories;
Rails Approach: <%= link_to "#{category.name} #{category.title}", items_path(category: category.name) %>
Related
I'm trying to populate this drop down with comments but only end up with the first comment instead of all of them.
<div class="dropdown">
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Comments
<span class="caret"></span></button>
<% #comments.each do |z| %>
<% if z.post_id == post.id %>
<ul class="dropdown-menu">
<li><%= z.body %></li>
</ul>
</div>
<% end %>
controller:
class StaticPagesController < ApplicationController
def index
#posts = Post.all.order(created_at: :desc)
#comment = Comment.new
#comments = Comment.all
end
end
I think it is due to html structure or your post have only 1 comment. Try this
<div class="dropdown">
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Comments
<span class="caret"></span></button>
<ul class="dropdown-menu">
<% #comments.each do |z| %>
<li><%= z.body %></li>
<% end %>
</ul>
</div>
The reason is I think in your controller you might have fatched post and its related comments (post.comments), so you do not need to check for the post.
Update:
As you have updated your question you should change your controller as well.
Post.include(:comments).all.order(created_at: :desc)
Within your partial instead of #comments use post.comments It will work perfectly. Reason of doing this is performance issue. Notice now you are making a single query and saved condition check within look. Now take eg that you have 1000 post. You will iterate over 1000 post and each post have 1000 comments it will check for all? It doesn't make any sense.
so I have a Category model with a "has many" relationship to my Soup model.
Currently, I have my page rendering a list of Categories with the Soups within each below. The page output looks like this:
Ramen
*Soup 1
*Soup 2
Other Soups
*Soup 3
*Soup 4
I added the ability to click on the Category name to show/hide the Soups. But I'd like to have this functionality's scope limited to each Category. In other words, I'd like to have clicking "Ramen" show/hide Soup 1 and Soup 2 only. Right now, clicking any Category shows/hides all 4 Soups.
views> categories> index.html.erb
<ul id="folderList">
<% #categories.each do |category| %>
<li>
<img src="https://cdn4.iconfinder.com/data/icons/small-n-flat/24/folder-blue-128.png" alt="folder" width="10%">
<%= link_to category.name, '#', id: 'show_catcontents' %> (<%= category.soups.count%>)
<div id="catcontents">
<ul>
<%- category.soups.each do |soup| %>
<li><%= soup.name %></li>
<%- end %>
</ul>
</div>
</li>
<% end %>
</ul>
<script>
$(function() {
$('a#show_catcontents').click(function(event){
event.preventDefault();
$('div#catcontents').toggle();
});
});
</script>
Any and all help is appreciated
An easy way to do this while not changing all that much is to add an id to each of your elements to further specify them in your embedded ruby, and then hide that specific element rather than the whole catcontents <div> in your Javascript hide function.
For example:
<div id="catcontents">
<ul>
<%- category.soups.each do |soup| %>
<li id= <%= soup.name %> ><%= soup.name %></li>
<%- end %>
</ul>
</div>
And then of course just change your Javascript hide function to hide by the <li> id rather than the catcontents <div>.
I am listing previously used shipping addresses for user to select. I`m dynamically adding classes
<div class="row">
<% #shipping_addresses.each do |address| %>
<ul class=<%= "shipping_address_#{address.id}" %> >
<li><%= address['name'] %> </li>
<li><%= address['street'] %> </li>
<li><%= address['city'] %></li>
<li><%= address['country'] %></li>
<li><%= address['zip'] %></li>
<li><%= address['phone'] %> </li>
</ul>
<% end %>
</div> <!-- row -->
Problem is, that now I am trying to add a col-lg-3 bootstrap class to my ul`s, and it doesn`t work when I write it like this:
<ul class=<%= "shipping_address_#{address.id} col-lg-3" %> >
I get this output:
<ul class="shipping_address_38" col-lg-3="">
I also tried several different options and they don`t work.
Can anyone help?
Thank you
The actual html you are outputting is
<ul class=shipping_address_38 col-lg-3>
And your browser is interpreting this as best it can. The quotation marks in your template never make it to the actual html because they're not actually part of the string.
You could do something like
<ul class="<%= "shipping_address_#{address.id} col-lg-3" %>" >
Although in my opinion you're now past the point where ERB gets difficult to read - you may wish to refactor this into a helper.
I have a two-way many to many relationship between work and category models. When I pluck the categoies to show on my work#index
HTML:
<% #works.each do |work| %>
<article class="work-item" data-project="<%= work.id %>">
<header class="w-article-title ">
<%=raw work.svg %>
<h1 class="article-name"><%= work.name %></h1>
<ul class="categories-total n-visible">
<li><%= work.categories.pluck(:name) %></li>
</ul>
</header>
</a>
</article>
<% end %>
It ends up returning an array of strings like:
["Visual Design", "Strategy + UX", "UxD"]
How can I make the layout display:
indiviual list items?
Remove the brackets
trim the "" off the string
<ul class="categories-total n-visible">
<% work.categories.pluck(:name).each do |n| %>
<li><%= n %></li>
<% end %>
</ul>
1) i have 2 tabs Categories and SubCategories on db with relation 1 to many (im using entity framework)
2) i have to create a vertical menu like this
<ul>
<li>category 1
<ul>
<li>subcategory 1</li>
<li>subcategory 2</li>
<li>subcategory 3</li>
</ul>
</li>
</ul>
i think that my problem is here in my function
Function List_category_subcategory() As List(Of WHAT HERE???????)
Using db As New DBTestEntities
Dim q = From cat In db.categories Join subcat In db.subcategories On cat.CategoryID Equals subcat.CategoryID _
Select New With {cat.CategoryName, subcat.SubCategoryName}
List_category_subcategory = WHAT HERE???????
End Using
End Function
because i dont know what function have to return (maybe a list collection)
After it on my view have to cycle everything
something like that
<ul>
<% For Each cat In ??????%>
<li><%=Html.Encode(cat.CategoryName)%>
<ul>
<% For Each subcat In ???????%>
<li><%=Html.Encode(subcat.SubCategoryName)%></li>
<% Next%>
</ul>
</li>
<% Next%>
</ul>
Shouldn't SubCategory be a property of category (it kind of seems more natural but I could be wrong here)? Also you have a malformed li tag in the nested loop (<li<%=):
<ul id="menu-1" class="menu">
<% For Each category In Model.Category %>
<li>
<%= Html.Encode(category.CategoryName) %>
<ul>
<% For Each subcategory In category.SubCategory %>
<li>
<%= Html.Encode(subcategory.SubCategoryName) %>
</li>
<% Next %>
</ul>
</li>
<% Next %>
</ul>
Missing closing > on inner li?