Если выбран переключатель, измените список путей link_to в Rails 4

#ruby-on-rails #radio-button #conditional

#ruby-on-rails #переключатель #условные операторы

Вопрос:

У меня есть список link_to , подобный этому:

 <li><%= link_to "Carpooling", offers_path(:category => {:category => "Carpooling"}) %></li>
<li> <%= link_to "Tutoring", offers_path(:category => {:category => "Tutoring"}) %></li>
<li><%= link_to "Studying", offers_path(:category => {:category => "Studying"}) %></li>
<li><%= link_to "Career", offers_path(:category => {:category => "Career"}) %></li>
<li><%= link_to "Art", offers_path(:category => {:category => "Art"}) %></li>
<li><%= link_to "Culture", offers_path(:category => {:category => "Culture"}) %></li>
  

Я хотел бы иметь две переключающие кнопки, одна из которых называется Offers, а другая — Requests. Если выбран переключатель Requests, я бы хотел, чтобы пути изменились на requests_path... . Если выбран переключатель Offers, я бы хотел, чтобы пути оставались такими, какие они есть.

Я раньше не кодировал переключатели, поэтому не уверен, с чего начать. Я думаю, что буду использовать radio_button_tag помощник, или мне следует оформить это в форму и использовать f.radio_button ? Моя главная проблема заключается в определении условного оператора. Есть идеи?

введите описание изображения здесь

Ответ №1:

Вы можете использовать polymorphic_path для перехода к действию ‘index’ для разных ресурсов, без необходимости жестко кодировать имя метода.

 <li><%= link_to "Carpooling", polymorphic_path(params[:selected_resource], :category => {:category => "Carpooling"}) %></li>
  

где params[:selected_resource] соответствует названию вашего радиовхода, а значениями этого ввода являются либо «запросы», либо «предложения»

Комментарии:

1. Эй, я пробовал это, но я получаю ошибку Nil location provided. Can't build URI. . Есть идеи, что могло бы вызвать это?

2. Вероятно, params[:selected_resource] так nil и есть. Возможно, вы захотите установить переменную экземпляра в вашем контроллере и установить для нее разумное значение по умолчанию, если ничего не выбрано.

Ответ №2:

Похоже, вы хотите, чтобы набор ссылок изменялся динамически, как при загрузке страницы, и пользователь мог выбирать запросы или предложения. Если это так, я дам вам базовый подход здесь, и я уверен, что вы сможете воспользоваться им оттуда.

Во-первых, переключатели являются элементами на стороне клиента, с которыми можно взаимодействовать после того, как страница была отрисована для пользователя. Таким образом, любые помощники rails и другие здесь больше не будут полезны. Итак, для выполнения этой условной логики вам понадобится помощь в кодировании на стороне клиента или, более конкретно, javascript через jQuery.

Здесь можно использовать много подходов, но вот один из них, который я бы порекомендовал.

Сначала нарисуйте ВСЕ элементы, которые вы хотите отобразить на странице, вот так:

 <%= link_to "Text 1", my_path, :class => 'link request_link' %>
<%= link_to "Text 2", my_path, :class => 'link offer_link' %> 
  

Это приведет к HTML, подобному:

 <a class="link request_link" href="/my_path">Text 1</a>
<a class="link offer_link" href="/my_path">Text 2</a>
  

Для переключателей вы можете использовать form_for или radio_button_tag, на самом деле это не имеет значения, но результирующий HTML, который вы хотите, будет выглядеть примерно так:

 <input class="link_selector" type="radio" name="link_selector" value="request_link" />
<input class="link_selector" type="radio" name="link_selector" value="offer_link" />
  

Обратите внимание, что значение переключателя соответствует имени класса ссылки, а имя класса для кнопок — link_selector. Подход здесь будет заключаться в добавлении слушателя к переключателям link_selector таким образом, чтобы при выборе одного из них:

  • Извлеките значение выбранного переключателя
  • Скройте элементы ссылок
  • Покажите ссылки, где класс == значение выбранного переключателя.

Некоторый псевдокод:

 //This happens when the page is ready
jQuery(document).ready(function() {
  //Hide all links
  $(".link").hide();

  //Add a listener to the radio buttons
  $(".link_selector").change(function() {
    var value = $(this).val()
    $(".link").hide();      //Hide all links
    $("."   value).show();  //Show the appropriate links
  });

  //Optionally, pre-select one of the radio buttons at this point, which 
  //should trigger the listener to show the proper links; otherwise, no 
  //links will appear when the page initially loads.
});
  

Опять же, есть много способов добиться этого, но вывод здесь заключается в том, что для этого вам нужно будет использовать javascript.

Надеюсь, это поможет!