Вопрос по checkbox, ruby-on-rails, forms, checkedtextview – показать остаток формы, если в ruby на рельсах установлен флажок

1

Мне нужно спросить моего пользователя, оплатит ли сервис кредитной картой ... если он выбрал опцию pay_with_card? он должен показывать остальную часть формы, которая запрашивает другие данные, такие как номер карты, почта и т. д. Если пользователь не проверил это, он должен показать сообщение, вопрос ... как я могу это сделать? заранее спасибо

<code><%= form_for(@product) do |f| %>
  <%= f.label :pay_with_card? %>
  <%= f.check_box :pay_with_card,{}, "Yes", "No"%>
  <div>
    <%= f.label :card_number %> <%= f.text_field :card_number %>
  </div>  
  <div>
    <%= f.label :mail %> <%= f.text_field :mail %>
  </div>
<% end %>
</code>

Ваш Ответ

5   ответов
1

Вы можете сделать это через jQuery, например:

$ ->
  $('select#pay_with_card').change ->
    if $(this).val() == 'yes'
      $('.card_block').slideDown('fast')
    else
      $('.card_block').slideUp('fast')

предположил, что часть формы с платежной картой включена в div с классом .card_block

1

например:

<%= link_to 'pay with card', your_current_path(:pay_with_card => 1) %>
<%= form_for(...) do |f| %>
  <% if params[:pay_with_card] %>
    <%= # fields for card %>
  <% end %> 
<% end %>
8

Во-первых, оберните поля вашей кредитной карты в div с классом Credit_card_fields и добавьте этот код JS на свою страницу:

$("input[type='checkbox']#pay_with_card").on('change', function(){
  $('.credit_card_fields').toggle();
});
9

display: none;", затем добавьте некоторый javascript к флажку, чтобы изменить его на display: block;

Что-то вроде этого

<%= form_for(@product) do |f| %>
  <%= f.label :pay_with_card? %>
  <%= f.check_box :pay_with_card,{}, "Yes", "No"%>
  <div id="card_details" style="display:none;">
    <%= f.label :card_number %> <%= f.text_field :card_number %>
    <%= f.label :mail %> <%= f.text_field :mail %>
  </div>
<% end %>
<script type="text/javascript">
  var checkbox = document.getElementById('product_pay_with_card');
  var details_div = document.getElementById('card_details');
  checkbox.onchange = function() {
     if(this.checked) {
       details_div.style['display'] = 'block';
     } else {
       details_div.style['display'] = 'none';
     }
  };
</script>
@ suely Проверьте этот вопрос для получения дополнительной информации о том, где разместить свой JavaScript: / Stackoverflow.com вопросы / 3437585 / ... Unixmonkey
Это не обязательно должно быть в application.js, но оно, безусловно, может пойти туда. Это зависит от того, как вы хотите организовать свой код JavaScript. Я помечаю свое тело атрибутами данных для контроллера и действия, и в моем document.ready я определяю, какой файл JS загружать и какую функцию выполнять, но все делают это по-своему. Вы не указали, поэтому я пошел с ванильным JS, но вы можете использовать код makaroni4, если у вас загружен jQuery, и user1047843, если вы используете coffeescript. Unixmonkey
О, из-за того, как rails добавляет идентификаторы к элементам формы, это должно быть var checkbox = document.getElementById ('product_pay_with_card'); Unixmonkey
спасибо за ваш ответ, но в коде, который вы публикуете ... это как вы сказали, но флажок кода var ... и т. д. должен быть в assets / javascript / application.js ???????? suely
спасибо @ Unixmonkey, он показывает только карту pay_with_card? если пользователь нажимает, он должен показать остальную часть формы, но это не так, конечно, я делаю что-то не так ... пожалуйста, направьте меня suely
0

весь код в представлении, если пользователь проверяет pay_with_card ... (код mi на испанском языке), он показывает полную форму ... если не проверено, ничего не показывает, все то же самое чекбокс с просьбой об оплате ... спасибо, ребята.

function mostrar (){
var checkbox = document.getElementById('chk_tarjeta');
if (checkbox.checked)
document.getElementById("card_details").style.display = "block";
else
document.getElementById("card_details").style.display = "none";
</script>

<h1>Forma de Pago</h1>
<%= form_for(@product) do |f| %>
<div id="product_pay_with_card">
<div >
<%= f.label :paga_con_tarjeta? %></br>
<%= f.check_box :paga_con_tarjeta, :id => "chk_tarjeta", :onclick => "mostrar();" %>
<div>
</div>
</div>
<div id="card_details" >
<div>
<%= f.label :numero_de_tarjeta %></br>
<%= f.text_field :numerotarjeta %>
</div>
<div>
<%= f.label :codigo_de_seguridad %></br>
<%= f.text_field :codigoseguridad %>
</div>

Похожие вопросы