Отображение встроенных ошибок с помощью simple_form в модале Bootstrap Ajax

Я нашел похожие вопросы StackOverflowВот а такжеВот но все еще не могу заставить это работать.

Я использую Rails 3.2.8, SimpleForm 2.0.4 и Twitter Bootstrap 2.1.1 (с помощью самоцвета bootstrap-sass 2.1.1.0).

Пользователь должен иметь возможность добавить контакт из модального всплывающего окна. Если есть ошибки проверки, они должны отображаться встроенными, как если бы пользователь использовал немодальную версию формы (красная рамка вокруг поля, сообщение об ошибке рядом с полем).

Я загружаю модал так:

<a data-toggle="modal" data-target="#new-contact-modal">Go modal!</a>

Вот модальный Bootstrap, который вызывает тот жеcontacts/contact_fields частично используется в немодальной версии.приложение / просмотров / контакты / _new_modal.html.erb:

<div id="new-contact-modal" class="modal hide fade" tabindex="-1" 
     role="dialog" aria-labelledby="new-contact-modal-label" 
     aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" 
     aria-hidden="true">×</button>
    <h3 id="new-contact-modal-label"><%= t("contacts.new.header") %></h3>
  </div>
  <%= simple_form_for(@contact, 
      :remote => true,
      :html => {:class => "form-horizontal", 
                "data-type" => :json }) do |contact_form| %>
    <div id="new-contact-body" class="modal-body">
      <%= render 'contacts/contact_fields', :f => contact_form %>
    </div>
    <div class="modal-footer">
      <%= contact_form.submit :class => "btn btn-primary", 
          :"data-loading-text"=> ('simple_form.creating') %>
      <%= t('simple_form.buttons.or') %>
      <a data-dismiss="modal" aria-hidden="true">
        <%= t('simple_form.buttons.cancel') %>
      </a>
    </div>
  <% end %>
</div>

приложение / контроллеры / contacts_controller.rb (намеренно закомментировалformat.json строка, так как я пытаюсь отправить весь модальный обратно с помощью JavaScript):

def create
  @contact = Contact.new(params[:contact])
  <...some additional processing...>
  respond_to do |format|
    if @contact.save
      format.html { flash[:success] = "Contact added."
                    redirect_to @contact }
      format.json { render json: @contact, status: :created, location: @contact}
    else
      format.html { render action: "new" }
      #format.json { render json: @contact.errors, status: :unprocessable_entity }
      format.js { render 'new_modal_error' }
    end

приложение / просмотров / контакты / new_modal_error.js.erb

var modal = "<%= escape_javascript(render :partial => 'contacts/new_modal', :locals => { :contact => @contact.errors }) %>";
$("#new-contact-modal").html($(modal));

приложение / активы / JavaScripts / contacts.js Некоторые JQuery для сброса формы и закрытия модальных при успехе.

$(function($) {
  $("#new_contact")
    .bind("ajax:success", function(event, data, status, xhr) {
      // http://simple.procoding.net/2008/11/22/how-to-reset-form-with-jquery :
      $(this).each(function(){
        this.reset();
      });       
      $("#new-contact-modal").modal("hide");
    })
});

Хорошая новость заключается в том, что это работает, когда в форме нет ошибок: контакт добавлен, а модальный скрыт. Однако если естьнаходятся ошибки проверки, я получаю сообщение «JSON.parse: неожиданный символ». Это происходит из jquery.js, строка 515, которая являетсяreturn утверждение в этом фрагменте:

// Attempt to parse using the native JSON parser first
if ( window.JSON && window.JSON.parse ) {
    return window.JSON.parse( data );
}

Если я проверяюdataЯ вижу, что это содержание моегоnew_modal_error.js файл, полностью раскрытый с ошибками формы и экранированный для JavaScript. Но это не JSON.

Чего мне не хватает? Как мне получить страницу для обработкиnew_modal_error.js как файл JavaScript, а не переменная JSON? Или есть более простой способ справиться с этим вообще?

Ответы на вопрос(2)

Ваш ответ на вопрос