我问的是使用带有Rails表单助手的Twitter Bootstrap模式窗口并显示表单验证错误消息.我正在使用Twitter Bootstrap 2.0和Rails 3.2.
我在Twitter Bootstrap模式窗口中有一个表单.页面上有一个按钮,用于打开模态窗口并显示表单.一切都很好,除非提交表单时出现错误,显示页面并且无法看到错误消息,因为表单位于(最初未显示的)模式窗口内.
我需要使用jQuery来测试表单是否包含Rails错误消息并覆盖“display:none;”呈现页面时样式(或切换要显示的模态窗口).
我已经尝试将以下代码添加到我的assets / javascripts / application.js文件中,但它不起作用:
$('document').ready(function() {
if ($('#error_explanation').length > 0) {
$("#request_invite").css("display","block");
}
})
并且:
$('document').ready(function() {
if ($('#error_explanation').length > 0) {
$("#request_invite").modal('toggle');
}
})
当出现错误信息时,我需要做什么来显示模态窗口或将其打开?
这是在Twitter Bootstrap模式窗口(Haml)中显示表单的代码:
#request-invite.modal{:style => "display: none;"}
= form_for(resource,:as => resource_name,:url => registration_path(resource_name)) do |f|
.modal-header
%a.close{"data-dismiss" => "modal"} ×
%h3 Request Invitation
.modal-body
- if @user.errors.any?
#error_explanation
%ul
- @user.errors.full_messages.each do |msg|
%li= msg
%p
= f.label :email
%br/
= f.email_field :email
.modal-footer
= f.submit "Request Invitation",:class => "btn.btn-success"
%a.btn{"data-dismiss" => "modal",:href => "#"} Close
#romance-copy{:style => "text-align: center; margin-top: 100px"}
%h2 Want in?
#call-to-action{:style => "text-align: center; margin-top: 100px"}
%a.btn.btn-primary.btn-large{"data-toggle" => "modal",:href => "#request-invite"} Request invite
解决方法
看起来像拼写错误?你在Haml的div有ID请求 – 邀请(带破折号). 但是,您的jQuery正在寻找带下划线的ID.