我想在laravel 5.2的注册表单中查看同一页面中用户名的可用性。我将如何使用Jquery AJAX。我想检查现场是否输入了密钥。我只是个新手。请帮帮忙?
答案 0 :(得分:1)
这是我的代码,
实际上我用laravel 4.2版本做了这个,但是在代码级别没有任何变化只是一个语法级别的变化就像laravel 5. *在刀片文件中使用{{
和}}
括号当larvel 5使用{!!
和!}}
首先,您必须使用jquery验证方法验证您的for,您可以查看此link
这会让你更好地了解如何验证使用jquery验证,这很容易使用,只需要加载一个jquery和一些验证方法就可以了。
以下是我的观看文件:
<!-- Change the "src" attribute according to your installation path -->
<script src="vendor/jquery-validation/dist/jquery.validate.min.js"></script>
<form action="{{ URL::to('signup/create') }}" method="POST" class="signup-form" id='signup-form1' enctype="multipart/form-data">
<div class="container">
<div class="row form-div">
<div class="row">
<div class="col-sm-6">
<div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtMsg custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside">
<input type="email" placeholder="Email Address" name="email" id="regemail">
</span> </span>
<div class="clearfix"></div>
<div class="erroremail register-error-block"></div>
</div>
</div>
<div class="col-sm-6">
<div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtTag custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside">
<input type="text" placeholder="Gamer Tag" name="gamertag" id="gamertag">
</span> </span>
<div class="clearfix"></div>
<div class="errortag register-error-block"></div>
</div>
</div>
</div>
</div>
</div>
<p class="Create-account-btn">
<button class="btn btn-skew btn-red" type="submit" name="register" id="register-btn"><span>Create Account</span></button>
</p>
</form>
现在为此注册表单添加jquery验证
$("#signup-form1").validate({
errorElement : 'div',
errorLabelContainer: '.errorTxt',
ignore: [],
rules: {
email:{
required:true,
email:true,
remote: {
url: "signup/checkemail",
type: "post",
data: {email: $("input[email='email']").val(), _token: $('input[name=_token]').val()},
dataFilter: function (data) {
var json = JSON.parse(data);
if (json.msg == "true") {
return "\"" + "Email address already in use" + "\"";
} else {
return 'true';
}
}
}
},
gamertag: {
required: true,
alphanumeric:true
},
},
messages: {
email: {
required: "Email address is required.",
email: "Please enter valid email address.",
remote: "Email address already in use!"
},
gamertag: {
required: "Gamer Tag is required.",
alphanumeric: "Gamer Tag must contain alphanumeric string."
}
},
errorPlacement: function(error, element) {
//$(element).closest('.skew').append()
if (element.attr("name") == "email" ) {
$(".erroremail").append(error);
}
else if (element.attr("name") == "gamertag" ) {
$(".errortag").append(error);
}
else {
error.append($('.errorTxt span'));
}
},
invalidHandler: function (event, validator) { //display error alert on form submit
},
highlight: function (element) { // hightlight error inputs
$(element).closest('.skew').addClass('has-error'); // set error class to the control group
},
unhighlight: function (element) { // revert the change done by hightlight
$(element).closest('.skew').removeClass('has-error'); // set error class to the control group
},
success: function (label) {
label.closest('.skew').removeClass('has-error'); // set success class to the control group
},
submitHandler: function(form) {
//console.log(form);
$("#signup-form1").submit();
// Adding a New Post
}
});
在上面的脚本中如果您注意到我已经使用了remote: { }
方法,那么如果给定的电子邮件存在于数据库中,它还会检查ajax调用。
并执行我在我的控制器中做了一些像这样的事情
这是我的控制器功能,用于检查电子邮件是否存在。
public function postCheckemail(){
//$user = Register::where('email', Input::get('email'))->get();
$user = DB::table('users')->where('email', Input::get('email'));
if($user->count()) {
return Response::json(array('msg' => 'true'));
}
return Response::json(array('msg' => 'false'));
}
将以json格式返回带有true和false的消息。
这是与ajax,
现在,如果你不想要这个jquery验证方法,那么你可以使用laravel本身提供的验证功能here
说这是查看文件:
<form action="{{ URL::to('signup/create') }}" method="POST" class="signup-form" id='signup-form1' enctype="multipart/form-data">
<div class="container">
<div class="row form-div">
<div class="row">
<div class="col-sm-6">
<div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtMsg custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside">
<input type="email" placeholder="Email Address" name="email" id="regemail">
</span> </span>
<div class="clearfix"></div>
<div class="erroremail register-error-block"></div>
</div>
</div>
<div class="col-sm-6">
<div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtTag custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside">
<input type="text" placeholder="Gamer Tag" name="gamertag" id="gamertag">
</span> </span>
<div class="clearfix"></div>
<div class="errortag register-error-block"></div>
</div>
</div>
</div>
</div>
</div>
<p class="Create-account-btn">
<button class="btn btn-skew btn-red" type="submit" name="register" id="register-btn"><span>Create Account</span></button>
</p>
</form>
这是控制器功能来验证它。
public function postCreate(){
$validator = Validator::make(array(
'email' => Input::get( 'email' ),
'gamertag' => Input::get( 'gamertag' ),
),
array(
'email' => 'required|email|unique:users',
'gamertag' => 'required|min:3'
));
if ($validator->fails())
{
$messages = $validator->messages()->first();
//return Redirect::to('signup')->with('error_message', $messages);
$data['success'] = false;
$data['message'] = $messages;
}
else
{
//Your insert Query here to store the data in database
}
return Response::json($data);
}
多数民众赞成!
如果你随时都在任何地方,请不要犹豫再问我。