我正试图使用rails 3.2、twitter/bootstrap和formtastic在我的模态中返回验证,但我不知道如何做到这一点。
下面是我的语气和形式的快速示例。在模型中,我需要名字和姓氏。如果用户点击"提交"而没有输入名字或姓氏,它会立即将用户带到我的实际注册页面,并通知他们缺少什么。
但我希望它能回到这个模式,让用户知道缺少了什么。我该如何做到这一点?
:在我的标题中,这是我提出模式的方式:
=link_to 'Register', "#new_registration_modal", :data => { :toggle => "modal",:backdrop => "static" }
#app/views/subscribers/registration/new_modal.html.haml
#new_registration_modal.modal.hide.fade
.modal-header
Some Text
.modal-body
Some Text
=semantic_form_for(:subscriber, :as => resource_name, :url => registration_path(resource_name),:html => { :class => "form-inline" } ) do |f|
=f.input :email
=f.input :firstname
=f.input :lastname
=f.input :password
=f.input :password_confirmation
=f.submit
.modal-footer
Some Text
我找到了一个适合我的解决方案(使用simple_form),也许可以帮助你:
我想在另一个控制器的模态中添加一个新的客户端。
模态控制器视图:
<div id="client_modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="client_modal_label" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="client_modal_label">Create new client</h3>
</div>
<div class="modal-body">
<%= simple_form_for Client.new, html: {"data-type" => :json}, remote: true do |f| %>
<div id="error_explanation" style="display:none;"></div>
<div class="form-inputs">
# the inputs
# ... and "closing" the modal
client_controller.create
:
def create
# save the data
if @client.save
respond_to do |format|
format.html { redirect_to anagrafe_index_path, :notice => "Client create!"}
format.json { render json: @client, status: :created, location: @client }
end
else
respond_to do |format|
format.html { render :action => 'new'}
format.json { render json: @client.errors.full_messages, status: :unprocessable_entity }
end
end
end
提出模态的js.coffee:
$ ()->
$("form.new_client").on "ajax:success", (event, data, status, xhr) ->
$("form.new_client")[0].reset()
$('#client_modal').modal('hide')
$('#error_explanation').hide()
$("form.new_client").on "ajax:error", (event, xhr, status, error) ->
errors = jQuery.parseJSON(xhr.responseText)
errorcount = errors.length
$('#error_explanation').empty()
if errorcount > 1
$('#error_explanation').append('<div class="alert alert-error">The form has ' + errorcount + ' errors.</div>')
else
$('#error_explanation').append('<div class="alert alert-error">The form has 1 error.</div>')
$('#error_explanation').append('<ul>')
for e in errors
$('#error_explanation').append('<li>' + e + '</li>')
$('#error_explanation').append('</ul>')
$('#error_explanation').show()