Ruby: Changing an array of items into links in an ERB - ruby-on-rails

I have an array of strings that I want to interpolate into links within an erb file.
How would I approach this syntactically?
Currently, I have the following
<% names.each do |name| %>
<b>
<%=name%>
</b>
<%end%>
<% navigation=["home","about us","store","contact","blog"] %>
<%navigation.each do |navitem| %>
<ul>
<li>
<a href= <%=/#{navitem}/%>".html">
<%=navitem%>
</a>
</li>
</ul>
<%end%>

Change
<a href= <%=/#{navitem}/%>".html">
to
<a href="<%= navitem %>.html">

Related

How would you use bootstrap tabs while using an all.each do | | function in rails?

I have a list of items in rails that I would like to display in Tabs, what is the best way to achieve this in rails? Below is the code.
<ul class="nav nav-tabs">
<% State.all.each do |state| %>
<div class="btn-group btn-group" role="group">
<%= link_to state.status, tickets_path(state: state.status), :class => "panel-heading" %>
<div class="badge">
<%= state.tickets.count %>
</div>
</div>
<% end %>
Basically it is a list of about 8 categories which once clicked on filters the list based on the category.
Currently it displays with no tab styling. My goal is these bootstrap tabs.
State is the category class and Status is the actual category
You're not building the correct structure for the tabs.
The Bootstrap documentation specifies that you should create a structure that looks like this:
<ul class="nav nav-tabs">
<li role="presentation" class="active">Home</li>
<li role="presentation">Profile</li>
<li role="presentation">Messages</li>
</ul>
The structure that you're creating looks like this:
<ul class="nav nav-tabs">
<div class="btn-group btn-group" role="group">
[state status]
<div class="badge">[ticket count]</div>
</div>
<!-- more for each state -->
</ul>
What you actually want is something like this:
<ul class="nav nav-tabs">
<% State.all.each do |state| %>
<li role="presentation">
<%= link_to tickets_path(state: state.status) do %>
<%= state.status %>
<span class="badge"><%= state.tickets.count %></span>
<% end %>
</li>
<% end %>
</ul>

Add options as tags from a list

I am trying to implement a list that gives suggestions to users as they type in a form field and add that option as a tag once they click/enter on the option. just like in Upwork skills field
I have languages as options and users can select multiple languages.
Right now, I have it implemented as a dropdown with checkboxes.
<div class="button-group">
<label class="form-control" data-toggle="dropdown">Choose Languages<span class="fa fa-angle-down"></span> </label>
<ul class="dropdown-menu">
<li>
<a class="small"><%= f.check_box :language5, {}, 'none', nil %> No Other Language</a>
</li>
<li>
<a class="small"><%= f.check_box :language1, {}, 'arabic', nil %> Arabic </a>
</li>
<li>
<a class="small"><%= f.check_box :language2, {}, 'cantonese', nil %> Cantonese </a>
</li>
<li>
<a class="small"><%= f.check_box :language3, {}, 'french', nil %> French </a>
</li>
<li>
<a class="small"><%= f.check_box :language4, {}, 'spanish', nil %> Spanish </a>
</li>
</ul>
</div>
Would love some guidance in the implementation of the tag-type method. TIA.

How to add link_to block with spans inside it

I am having a bit of trouble figuring out how to create a link_to tag for the syntax below.
<li class="bg-master-lighter">
<a href="#" class="clearfix">
<span class="pull-left">Logout</span>
<span class="pull-right"><i class="pg-power"></i></span>
</a>
</li>
I am using devise gem so i am trying to add a logout method to the link but my styling goes like above
As per Devise manual the link should look like this:
<li class="bg-master-lighter">
<%= link_to destroy_user_session_path, method: :delete, class: "clearfix" do %>
<span class="pull-left">Logout</span>
<span class="pull-right"><i class="pg-power"></i></span>
<% end %>
</li>

Dashing - reorder/sorting widgets

is it possible to reorder/move widgets by given property on the dashboard ?
i am adding widgets dynamically to the dashboard by pushing data from a job to the erb file:
<div class="gridster">
<ul>
<% settings.servers.each do |data| %>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<div data-id="<%=data['webHost']%>" data-title="<%=data['name']%>" data-version="<%=data['Version']%>" >
</li>
<% end %>
</div>
You can organize your widgets changing data-row and data-col.
If there are some property on your data that can be used to sort them the widgets, you could use it on data-row and data-col
Ex.:
<% settings.servers.each do |data| %>
<li data-row="<%= data['row'] %>" data-col="<%= data['col'] %>" data-sizex="1" data-sizey="1">
<div data-id="<%=data['webHost']%>" data-title="<%=data['name']%>" data-version="<%=data['Version']%>" >
</li>
<% end %>

Angular Js curly braces in rails erb

Does anyone know if it is possible to render angular js curly braces type {{ }}
in ERB as parameters.
eg.
<=home_url( {{code.id}}, #code)/>
Taken from the example from here:
<div>
<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
Also check this tutorial: http://blog.berylliumwork.com/2013/03/best-practice-of-using-angularjs-with.html
where you can see this example:
<div data-ng-init='mailbox.selected = "<%= #current_page %>"'>
<ul class="nav nav-tabs">
<li data-ng-class='{active: (mailbox.selected == "inbox")}'>
<%= link_to mails_inbox_path, 'Inbox' %>
</li>
<li data-ng-class='{active: (mailbox.selected == "outbox")}'>
<%= link_to mails_outbox_path, 'Outbox' %>
</li>
<li data-ng-class='{active: (mailbox.selected == "draft")}'>
<%= link_to mails_draft_path, 'Draft' %>
</li>
</ul>
</div>

Resources