[Rails5] japanMap link How to write parameters in js.erb file

It will be first post. I'm a beginner for 4 months since I started programming. Thank you.

When creating a portfolio, you can now search for events by 8 regions using japanMap. At that time, I had a little trouble passing arbitrary parameters to the links for each region, so I posted it for confirmation by myself.

This time, I wrote the japanMap program in the application.js file.

Below is the code I wrote.

application.js


//Search page Japan map
$(function(){
  //Create links in 8 regions
  var areaLinks = {
    1:"/user/index?sort=hokkaido",
    2:"/user/index?sort=tohoku",
    3:"/user/index?sort=kanto",
    4:"/user/index?sort=chubu",
    5:"/user/index?sort=kinki",
    6:"/user/index?sort=chugoku_shikoku",
    7:"/user/index?sort=kyusyu_okinawa",
  };

  //8 Local area designation
  var areas = [
    {code : 1, name: "Hokkaido", color: "#ab86c4", hoverColor: "#dfcceb", prefectures: [1]},
    {code : 2, name: "Tohoku",   color: "#6d93d1", hoverColor: "#91b0e3", prefectures: [2,3,4,5,6,7]},
    {code : 3, name: "Kanto",   color: "#f5a164", hoverColor: "#f5c09a", prefectures: [8,9,10,11,12,13,14]},
    {code : 4, name: "Chubu",   color: "#77e077", hoverColor: "#adedad", prefectures: [15,16,17,18,19,20,21,22,23]},
    {code : 5, name: "Kinki",   color: "#ffe966", hoverColor: "#fff2a3", prefectures: [24,25,26,27,28,29,30]},
    {code : 6, name: "Chugoku / Shikoku",   color: "#e68ccc", hoverColor: "#f0b9e0", prefectures: [31,32,33,34,35,36,37,38,39]},
    {code : 7, name: "Kyushu-Okinawa",   color: "#de6474", hoverColor: "#f29da9", prefectures: [40,41,42,43,44,45,46,47]},
  ];

  //Map display settings
  $("#map-container").japanMap({
    width: 600,
    areas  : areas,
    selection : "area",
    borderLineWidth: 0.25,
    drawsBoxLine : false,
    movesIslands : true,
    showsAreaName : true,
    font : "MS Mincho",
    fontSize : 13,
    fontColor :"#777",
    fontShadowColor : "white",
    onSelect : function(data){
    location.href = areaLinks[data.area.code];
  };
});

This part above is the link.

var areaLinks = {
    1:"/user/index?sort=hokkaido",
    2:"/user/index?sort=tohoku",
    3:"/user/index?sort=kanto",
    4:"/user/index?sort=chubu",
    5:"/user/index?sort=kinki",
    6:"/user/index?sort=chugoku_shikoku",
    7:"/user/index?sort=kyusyu_okinawa",
};

In the html.erb file, write as follows

:○○.html.erb


<%= link_to '◯◯', ○◯_path(:sort => 'hokkaido') %>

I didn't know how to write link_to in the js.erb file, so

php:○○.js.erb


1:"/user/index?sort=hokkaido"

I wrote it like this. By doing this, I was able to pass arbitrary params [: sort] parameters. The [? Sort = hokkaido] part is the parameter.

○○_controller.rb


def index
    if params[:sort] == 'hokkaido'
        @events = Event.where(prefecture_code: "Hokkaido")
	    @events = @events.page(params[:page]).per(6).order("id DESC")

The above is part of the controller. The event that distinguishes and displays the parameters is changed in the description of [if params [: sort] =='hokkaido'].

There may be some mistakes that are difficult to see in the first post, but thank you for watching until the end.

Recommended Posts

[Rails5] japanMap link How to write parameters in js.erb file
[Rails] How to write in Japanese
How to write Rails
How to use JQuery in js.erb of Rails6
How to write Rails validation
How to write Rails routing
[Ruby on Rails] How to write enum in Japanese
How to write a date comparison search in Rails
How to get parameters in Spark
Rails on Tiles (how to write)
[Rails] How to write exception handling?
How to introduce jQuery in Rails 6
[Rails] How to write user_id (foreign key) in strong parameter
How to install Swiper in Rails
How to write the view when Vue is introduced in Rails?
How to implement search functionality in Rails
How to use custom helpers in rails
How to insert a video in Rails
How to add jar file in ScalaIDE
How to use MySQL in Rails tutorial
[rails] How to configure routing in resources
How to implement ranking functionality in Rails
How to use credentials.yml.enc introduced in Rails 5.2
Rails: How to write a rake task nicely
[JavaFX] How to write Eclipse permissions in build.gradle
[Rails] How to write when making a subquery
[Rails] Various ways to write in seed files
How to link Rails6 Vue (from environment construction)
[Rails] How to use select boxes in Ransack
JUnit 5: How to write test cases in enum
How to translate Rails into Japanese in general
How to prevent direct URL typing in Rails
How to separate .scss by controller in Rails
How to conditionally add html.erb class in Rails
One way to redirect_to with parameters in rails
How to implement a like feature in Rails
How to easily create a pull-down in Rails
How to bind to property file in Spring Boot
[Ruby on Rails] How to install Bootstrap in Rails
How to make a follow function in Rails
How to write Java String # getBytes in Kotlin?
Rails "How to delete NO FILE migration files"
[Rails] How to use PostgreSQL in Vagrant environment
How to check Rails commands in the terminal
Notes on how to write comments in English
How to write dockerfile
How to uninstall Rails
How to write docker-compose
How to write Mockito
Javaer tries to summarize how to write properties in C #
How to set the display time to Japan time in Rails
How to implement a like feature in Ajax in Rails
[Ruby On Rails] How to reset DB in Heroku
[How to insert a video in haml with Rails]
How to test file upload screen in Spring + Selenium
How to convert a file to a byte array in Java
How to query Array in jsonb with Rails + postgres
[Rails 6] How to set a background image in Rails [CSS]
[Rails] How to get the contents of strong parameters
How to debug the generated jar file in Eclipse
How to write an external reference key in FactoryBot