Ruby удаленный частичный визуализируется дважды - PullRequest
0 голосов
/ 21 октября 2018

Я провел этот день, перемещая код, пробуя разные вещи и т. Д., Но не могу решить мою (возможно, простую) проблему.У меня есть кнопка на моем макете индекса, которая отображает частичную форму в модальном диалоге, чтобы а) создавать новые записи или б) редактировать существующие.Я использую материализованные, простые формы и гемы проверки на стороне клиента.

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

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

Спасибо всем за помощь, дайте мне знать, если вынужно больше, чем указано ниже.


Это код кнопки в index.html.erb макете

<div class="fixed-action-btn">

    <%= link_to "<i class='material-icons'>add</i>".html_safe, 
    new_patient_path, :remote => true, :id => 'new_patient_link', 
    :class => "btn-floating btn-large red" %>

</div>

, который затем загружаетсяjavascript в new.js.erb

$('#modal_partial').html('<%= escape_javascript(render('form')) %>');

, который впоследствии переводит частичку _form.html.erb в следующий div (который хранится в shared / _footer.html.erb частичный и располагается внизу страницы индекса.

<div id="form_modal_wrap">
  <div id="modal_partial" class="modal modal-fixed-footer">
  </div>
</div>

И _form.html.erb частичный:

<div id="edit_patient_modal" class="";>
<%= simple_form_for @patient, validate: true, remote: true do |f| %>

  <div class="modal-content" style="padding: 0px;">

    <h4 class="col s12" style="margin: 0px; padding: 10px 25px;">New Patient</h4>


    <%= f.error_notification %>


    <div class="row">

      <div class="col s12" style="padding: 0px;">

        <ul class="tabs" style="padding: 0px;">

          <li class="tab col"><a class="active"  href="#demographics">Demographics</a></li>
          <li class="tab col"><a class="active"  href="#admission">Admission</a></li>
          <li class="tab col"><a href="#presentation">Presentation</a></li>
          <li class="tab col"><a href="#jobs">Jobs</a></li>
          <li class="tab col"><a href="#results">Results</a></li>

        </ul>

      </div>


      <div id="demographics" class="col s12" style="padding: 20px;">

        <%= f.input :nhs, :label => "NHS"  %>

        <%= f.input :fname, :label => "Firstname" %>
        <%= f.input :lname, :label => "Lastname", validate: { presence: true, uniqueness: false }  %>
        <%= f.input :dob, :label => "DOB", as: :date, start_year: Date.today.year - 110,
                          end_year: Date.today.year - 12,
                          order: [:day, :month, :year] %>

        <%= f.input :mrn, :label => "MRN" %>



      </div>

      <div id="admission" class="col s12" style="padding:20px;" >

        <%= f.association :location %>
        <%= f.input :bed, :label => "Bed" %>
        <%= f.association :team, input_html: { multiple: true } %>

      </div>

      <div id="presentation" class="col s12" style="padding:20px;">



        <%= f.input :dx, :label => "Dx" %>
        <%= f.input :pmh, :label => "PMH" %>


      </div>

      <div id="jobs" class="col s12" style="padding:20px">

        <p>This job list is shared between all teams.</p>
        <%= f.input :jobs, :label => "Jobs" %>

      </div>

      <div id="results" class="col s12" style="padding:20px;">


      <table>
        <tr>
          <th>Group</th>
          <th>Result</th>
          <th>Date</th>
        </tr>
        <% @patient.results.each do |result| %>
          <tr>
            <td>
              <%= Investigation.find(result.investigation_id).group %>
            </td>
            <td>
              <%= Investigation.find(result.investigation_id).short %>
              <%= result.value %>
            </td>
            <td>
              <%= result.date %>
            </td>
          </tr>
        <% end %>
      </table>
      </div>

    </div>



  </div>


  <div class="modal-footer"> 

    <a id="modal_close" href="#!" class="modal-close waves-effect waves-pink btn-flat">Cancel</a>
    <%= f.button :submit, :class => "waves-effect btn" %>

  </div>



<% end -%>

Следующий javascript находится внизу _form.html.erb partical:

  $(document).ready(function(){
    $('#modal_partial .tabs').tabs();
    $('#modal_partial select').formSelect();
    $('#modal_partial').modal();
    $('#modal_partial').modal('open');
    $('form').enableClientSideValidations(); 
  });

  $("#modal_close").on("click", function(e) {
    e.preventDefault();
    $('#modal_partial').modal('close');
  });

</script>

Ответы [ 2 ]

0 голосов
/ 21 октября 2018

Итак, я выяснил, что я сделал в итоге ...

в application.js Я добавил оба следующих параметра:

//= require jquery_ujs
//= require rails-ujs

При удалении любого из этих модалов появился только один раз.После прочтения документации мне нужен только rails-ujs, поскольку он выполняет те же функции, что и jquery_ujs, но без зависимости от jquery.Это не значит, что вы не можете использовать jquery как независимое требование (как я до сих пор).

Таким образом, решение было удалить строку // = require jquery-ujs и просто имейте следующее:

//= require rails-ujs

Спасибо lacostenycoder за вашу помощь

0 голосов
/ 21 октября 2018

Единственный способ отладки - это проверить КАЖДУЮ часть вашего кода, которая загружает JavaScript, включая ваши макеты.Что-то вызывает дублирование формы, но невозможно выполнить отладку, не увидев весь код.

...