使用 ajax 弹出错误信息
<div id="myModal" class="modal hide fade" role="dialog" data-backdrop="false">
<div class="modal-body1">
<p><%= @snew %></p>
</div>
</div>
<%= form_for(:session, url: sessions_path) do |f| %>
<table>
<tr>
<td><%= f.label :username %></td>
<td class="span4"><%= f.text_field :username %></td>
</tr>
<tr>
<td><%= f.label :password%></td>
<td class="span4"><%= f.password_field :password %></td>
</tr>
<tr>
<td><%= f.submit 'Sign in'%></td>
</tr>
</table>
<% end %>
@snew是控制器的错误信息“用户名或密码错误” 这个怎么具体实现 无刷新报登陆错误信息
貌似用 ajax 写这个 form 的 submit 然后后台判断有问题返回错误信息 ajax 接受完在根据错误信息更新你的那个 p 标签吧?你用实力变量的话就不是 ajax 了啊要服务器才能处理你的 ruby code 大概~菜鸟一名说错误怪哈~
JS/jquery写一个方法把form的submit拦截了,再以ajax方式带上参数请求对应的action。如果错误,可返回json一类的错误信息用以渲染;如果OK,则返回一个跳转链接再js操作一下即可。
form 表单
<div id="myModal" class="modal hide fade" role="dialog" data-backdrop="false">
<div class="modal-body1">
<p>wrong</p>
</div>
</div>
<%= form_for(:session, url: sessions_path, :html=>{:id => 'sess_form'}) do |f| %>
<table>
<tr>
<td><%= f.label :username %></td>
<td class="span4"><%= f.text_field :username, :id=>"us"%></td>
</tr>
<tr>
<td><%= f.label :password %></td>
<td><%= f.password_field :password, :id=>"pa" %></td>
</tr>
<tr>
<td><%= f.submit 'Sign in' ,id: "tt" %></td>
</tr>
</table>
<% end %>
jquery
$('#tt').click(function(){
$.ajax({
type: "post",
url:'/sessions/create',
data: {
username: $('#us').val(),
password: $('#pa').val()
},
success: function(data){
if(data=="true"){
$('#sess_form').submit();
}else{
$('#myModal').modal('show');
return false;
}
},
error: function(){
alert($('#us').val());
return false;
}
});
});
sessions action
def create
#@flash = false
login_name = params[:session][:username]
users = User.find_by_sql ["select * from users where username = :username or email = :email or card_number = :card_number", {:username => "#{login_name}", :email => "#{login_name}", :card_number => "#{login_name}"}]
user = users.first
if user && user.authenticate(params[:session][:password])
sign_in_hmp user
render :text=>"true"
else
render :text => "false"
end
end
结果 总是 进入 error function 求指教
error: function(XMLHttpRequest, textStatus){
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
}
弹出 0 0 error
event.preventDefault()
阻止它的默认行为,所以在执行你的 function 之后表单会立即提交。建议绑 form 的 submit 事件并调用 event.preventDefault()
。