我有一个注册模式,点击即可打开。使用 required 等在 View 上验证输入。问题是,我在 Controller 中再次验证规则的其他字段(也在其他模式中,我没有提及)。
我听说验证模式的一个好方法是使用 AJAX。我很难接受。
这是我的注册模式的简化版本,它在没有 javascript 或其他的情况下提交:
<div id="RegisterModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">× </button>
<h4 class="modal-title" id="myModalLabel">Register</h4>
</div>
<form class="form-horizontal" role="form" method="POST" action="{{ url('/register') }}">
{!! csrf_field() !!}
<div class="modal-body">
<div class="form-group{{ $errors->has('first_name') ? ' has-error' : '' }}">
<label class="col-md-4 control-label">First name</label>
<div class="col-md-6">
<input type="text" class="form-control" name="first_name"
value="{{ old('first_name') }}">
</div>
</div>
<div class="form-group{{ $errors->has('last_name') ? ' has-error' : '' }}">
<label class="col-md-4 control-label">Last name</label>
<div class="col-md-6">
<input type="text" class="form-control" name="last_name"
value="{{ old('last_name') }}">
</div>
</div>
<div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
<label class="col-md-4 control-label">E-Mail Address</label>
<div class="col-md-6">
<input type="email" class="form-control" name="email"
value="{{ old('email') }}">
</div>
</div>
<div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
<label class="col-md-4 control-label">Password</label>
<div class="col-md-6">
<input type="password" class="form-control" name="password">
</div>
</div>
<div class="form-group{{ $errors->has('password_confirmation') ? ' has-error' : '' }}">
<label class="col-md-4 control-label">Confirm Password</label>
<div class="col-md-6">
<input type="password" class="form-control" name="password_confirmation">
</div>
</div>
</div>
<div class="modal-footer">
<div class="form-group">
<div class="col-md-6 col-md-offset-2">
<button name="RegisterButton" type="submit" class="btn btn-primary">
<i class="fa fa-btn fa-user"></i> Register
</button>
</div>
</div>
</div>
</form>
</div>
</div>
当我提交时,模式关闭并且没有任何反应。如果我再次单击“注册”,模式会显示错误。
有人可以帮我吗?为我指明正确的方向?
最佳答案
据我了解,您正在正常提交表单,这会重新加载页面。所以页面重新加载后,你需要再次点击“注册”,打开模态,正确显示任何错误。
如果您想像这样正常提交表单,如果出现任何错误,您必须自动重新打开模式(使用 Javascript)。你可以像这样打开一个模式:
$('#modal').modal({show: true});
希望我正确理解了您的问题。
编辑1:如果有错误打开模式,使用以下代码:
@if(Session::has('errors'))
<script>
$(document).ready(function(){
$('#modal').modal({show: true});
}
</script>
@endif
编辑 2:通过 AJAX 提交表单并直接在模式中显示错误:
<?php
public function register()
{
...
if($Validator->fails())
{
$json = new stdClass();
$json->success = false;
$json->errors = $Validator->errors();
}
else
{
$json = new stdClass();
$json->success = true;
}
return Response::json($json);
}
?>
<script>
$('#registerForm').submit(function(){
var url = {{ route('myRegisterRoute') }};
var data = $('#registerForm').serialize();
$.post(url, data, function(response){
if(response.success)
{
// Print success message and close modal
}
else
{
$('#registerForm errorList').html(JSON.stringify(response.errors));
}
});
// return false to stop the normal submission
return false;
});
</script>
关于php - Laravel 中的 Bootstrap 模态验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38163050/