.map on array into string

Question

I have a an array returned when using .map:

<li class="mix <%= p.sectors.map {|s| "#{s.name}"} %> all">

gives array:

["Content Management System", "Web Design", "Web Development"]

at the moment the returned result in my view is:

<li class="mix ["Content Management System", "Web Design", "Web Development"] all mix_all" </li>

I want to use each s.name as a class name, but I have an issue when using:

<li class="mix <%= p.sectors.map {|s| "#{s.name}"}.join(" ") %> all">

where each word is being treated as a separate class, so Web Design is now two classes rather than one.

Is there a way to have Web Design as one class or do I need to use different naming conventions, like Web-Design to make this work?

BTW, why do you use such dreadful construction as "#{s.name}"? — Marek Lipka
– Marek Lipka, Commented May 20, 2014 at 10:29
"Web Design" are two classes because class names are separated by white space — Stefan
– Stefan, Commented May 20, 2014 at 10:33
@MarekLipka in reference to the construction..what would you do differently? — Richlewis
– Richlewis, Commented May 20, 2014 at 10:37
i started with that, but read that interpolation was more efficient? — Richlewis
– Richlewis, Commented May 20, 2014 at 10:38

Marek Lipka · Accepted Answer · 2014-05-20 10:24:57Z

5

This should work:

mix <%= p.sectors.map { |s| s.name.gsub(/\s+/, '-') }.join(' ') %>

answered May 20, 2014 at 10:24

Marek Lipka

51.3k7 gold badges90 silver badges93 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Richlewis Over a year ago

Thanks, works a treat :-), ill accept once default time constraints pass

Arup Rakshit Over a year ago

Can you show the final output ? I am not getting it

Marek Lipka Over a year ago

@ArupRakshit ["Content Management System", "Web Design", "Web Development"].map { |s| s.gsub(/\s/, '-') } # => ["Content-Management-System", "Web-Design", "Web-Development"]

Mark Thomas Over a year ago

Good answer, but I would put it in a helper method.

Max Williams · Accepted Answer · 2014-05-20 10:42:56Z

You can't have a class name with spaces in it. So, you need to convert your phrases into class names. Class names are typically downcased (though this isn't a requirement) and separated with hyphens (rather than underscores, although again this isn't a requirement, just a convention).

So, you could downcase and hyphen-separate them as follows

<li class="mix <%= p.sectors.map{|sector| sector.name.downcase.gsub(/[^a-z0-9\-]+/, '-') }.join(' ') %> all">

My regex here will replace 1 or more instances of anything that's not a letter, number or hyphen, with a hyphen, so the result should be

<li class="mix content-management-system web-design web-development all mix_all">

You could move this into the model:

#in Sector class
def html_classname
  self.name.downcase.gsub(/[^a-z0-9\-]+/, '-')
end

and then change the view code to

<li class="mix <%= p.sectors.map(&:html_classname).join(' ') %> all">

Collectives™ on Stack Overflow

.map on array into string

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related