写一个简单ajax登录和注册方法,缩简写法
以注册为例!!!请看注意点
四步:1 ruby 表单提交,2 controller ajax验证方法,3 jquery ajax 验证,4 ruby 表单提交
1 ruby 表单提交
假设有以下ruby 表单 注册提交
<%form_for :client_user,:url => {:controller=>'new',:action => 'regirest' },:html=>{:id=>'regirest_up'} do |f|%> <div id="regirest_pop" class="login_pop" style="display: none;"> <table cellspacing="0" cellpadding="0" border="0"> <tbody> <tr> <td width="60" align="right"> 邮箱: </td> <td> <%=f.text_field :email,:class=>"txt txt_mail error_u_mail",:id=>"u_mail"%> </td> </tr> <tr> <td width="60" align="right"> 昵称: </td> <td> <%=f.text_field :nickname,:class=>"txt txt_name error_u_username",:id=>"u_username"%> </td> </tr> <tr> <td width="60" align="right"> 密码: </td> <td> <%=f.password_field :password,:class=>"txt txt_name error_u_password",:id=>"u_password"%> </td> </tr> <tr> <td width="60" align="right">确认密码:</td> <td> <input id="u_pwd" class="txt txt_pwd2 error_u_password2" type="password" name="u_password2"></td> </td> </td> </tr> <tr> <td> </td> <td> <input type="checkbox" id="t_auto" name="t_auto" value="1"> <a href="#">同意淘价相关协议条款</a> </td> </tr> <tr> <td> </td> <td> <%=button_to_function '注册',:class=>"btn_registered",:id=>"miniregirest_submit"%> </td> </tr> </tbody> </table> <a class="btn_close" onclick="return false" href="javascript:;" id='regirest_close'>关闭</a> </div> <%end%>
注意:表单ID 为了提单表时,所需要。
注册按钮写法: 当为button,或是submit 时,html 页面显示都为submint型按钮,在点击后,表单一定会提交,所要写成 button_to_function 或是 html 中的button,这样可以让表单不提交。当 ajax 不提交表单时。
二 controller 方法
#ajax 注册email验证 def ajax_valid_email if params[:email] client_user=ClientUser.find(:all,:conditions=>["email= ?",params[:email]]) if client_user.size==0 render :text=>"true" else render :text=>"false" #render:text=>"false" and return false 为了此句后方法不执行 end else render :text=>"false" end end
注意:ruby传给页面参数只有 render 或 redirect_to ,在IE,使用xml传递时,与其它的浏览器xml不同。
3 jquery ajax验证
$('#miniregirest_submit').click(function(){ if($("#u_mail").val().length<3){ alert("邮箱格式不正确"); return false; } if($j("#u_username").val()==""){ alert("昵称不为空"); return false; } if($("#u_password").val()==""){ alert("密码不能为空"); return false; } if($("#u_password").val()!=$("#u_pwd").val()){ alert("密码不一至"); return false; } $.ajax({ type: 'POST', //请求方式 url: "/new/ajax_valid_email", //验证方法地址,这里是 验证email是否重用 data: {email: $("#u_mail").val()}, //传给url方法参数,格式化: 参数名:参数值,参数名
// 参数名与ruby 后台方法params[:email] 对应。 success: function(data){ //返回值结果是判断 if(data=="true"){ //返回true ,表单提交 $("#regirest_up").submit(); alert("同意协议后注册"); }else{ alert("用户名己存在"); return false; //防止表单提交,同时还可以产生页面不刷新的效果。 } } }); });
4 ruby 表单提交
def regirest
client_user=ClientUser.new(params[:client_user]) if client_user.save flash[:notice]="注册成功" else flash[:notice]="注册失败" end redirect_to :controller=>'w',:action=>'index' end
登录也是两只样的方法,自己试试吧。正规写法并不是这样的,我这里是自己缩简后的写哦。
希望能给和我一样的初学者带来帮助