Как сделать частичное в Javascript - PullRequest
Новая
       58

Как сделать частичное в Javascript

0 голосов
/ 04 мая 2019

У меня есть две формы на странице, которые в основном имеют одинаковые входные данные.У меня есть вкладки на экране, которые переключаются между каждой формы.Однако, когда я отправляю одну из форм, я получаю «не может быть пустым» в тех же полях ввода в другой форме.Я понимаю, почему это происходит.Я попытался остановить это с помощью оператора if, чтобы отображать только одну из форм в зависимости от того, на какой вкладке нажата.Это не сработало, так как вы не можете целевые идентификаторы html в операторе if.Затем я попытался использовать javascript, который использовал методы «show» и «hide» в зависимости от того, какая вкладка была нажата, что также не работало, так как я считаю, что, хотя форма все еще скрыта, она все еще на самом деле там.Теперь я не уверен, что делать.Моя единственная идея состоит в том, чтобы сделать формы внутри javascript? 

 <input id="tab1" type="radio" name="tabs" checked>
  <label class="label-header" for="tab1"> UK Address</label>

  <input id="tab2" type="radio" name="tabs">
  <label class="label-header"for="tab2"> International Address </label>

  <!-- <section id="content1"> -->
    <%# if  %>
        <%= f.simple_fields_for :address do |fields| %>
        <%# raise %>
            <section id="content1">
                <%= render "address/fields", fields: fields, addressable: addressable %>
            </section>
        <% end %>
      <%# else %>
        <%= f.simple_fields_for :address do |fields| %>
            <section id="content2">
                <%= render "address/international_fields", fields: fields, addressable: addressable %>
            </section>
        <% end %>


$(document).ready(function() {
  var uk_address = $('#content1');
  var international_address = $('#content2');
  $('#tab1').on('click', function() {
    uk_address.show();
    international_address.hide();
  });

  $('#tab2').on('click', function() {
    uk_address.hide();
    international_address.show();
  });

});

1 Ответ

1 голос
/ 04 мая 2019

Вы должны иметь возможность включать / отключать элементы внутри вашего javascript с этой модификацией: 

 $(document).ready(function() {
   var uk_address = $('#content1');
   var international_address = $('#content2');
   $('#tab1').on('click', function() {
     uk_address.removeAttr("disabled").show();
     international_address.attr("disabled", "disabled").hide();
   });

   $('#tab2').on('click', function() {
     uk_address.attr("disabled", "disabled").hide();
     international_address.removeAttr("disabled").show();
   });

 });
...