Javascript 提交时,使用jQuery、laravel 5.3将表单数据发送到表单外部的div
这是我的表格Javascript 提交时,使用jQuery、laravel 5.3将表单数据发送到表单外部的div,javascript,php,jquery,forms,laravel,Javascript,Php,Jquery,Forms,Laravel,这是我的表格 <form method="post" action="{{url('/vpage')}}"> <input type="hidden" name="_token" value="{{ csrf_token() }}"> <label>First Name</label> <input type="text" name="firstname" placeholder=
<form method="post" action="{{url('/vpage')}}">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<label>First Name</label>
<input type="text" name="firstname" placeholder="First Name" value="{{$user->firstname}}" >
<label>Email Address</label>
<input type="text" name="email" placeholder="Email Address" value="{{$user->email}}" >
<label>Phone Number <span> (optional)</span></label>
<input type="text" name="phone" placeholder="(888) 888-888" value="{{$user->phone}}" >
<button id="hitme" class="submitBTN getstart" type="submit" onclick='return false;'> Get Started </button>
</form>
名字
电子邮件地址
电话号码(可选)
开始
这是表格外的div
<div class="vgasRit">
<p>SUMMARY</p>
<div class="sfieldz w100">
<label>Name:</label>
<input type="text" placeholder="John Smith" value="{{$user->firstname}}">
</div>
<div class="w100">
<label>Email Address:</label>
<input type="text" placeholder="johnsmith@gmail.com" value="{{$user->email}}" >
</div>
<div class="w100">
<label>Phone Number:</label>
<input type="text" placeholder="(888) 888-888" value="{{$user->phone}}">
</div>
</div>
总结
姓名:
电邮地址:
电话号码:
我想在用户提交表单时访问“fistname”、“lastname”和“phone”的值,以便在summary div中显示它
注意:我在我的控制器中尝试了php的压缩功能,这样我可以在视图中发送整个数据库对象,但是这个解决方案不起作用,在使用压缩功能后,我像这样访问对象
<input type="text" placeholder="John Smith" value="<?= (!empty($group_data)) ? $group_data->firstname : '';?>">
假设所有内容都在同一页上,为表单的输入提供一个id:
<form id="form" method="post" action="{{url('/vpage')}}">
<label>First Name</label>
<input id="firstname" type="text" name="firstname" placeholder="First Name" value="{{$user->firstname}}" >
<label>Email Address</label>
<input id="email" type="text" name="email" placeholder="Email Address" value="{{$user->email}}" >
<label>Phone Number <span> (optional)</span></label>
<input id="phone" type="text" name="phone" placeholder="(888) 888-888" value="{{$user->phone}}" >
应该是这样。您的观点(我假设表单和summy div在同一个视图中):
路线:
Route::Route::match(['POST', 'GET'],'/vpage', 'ControllerName@vpageController');
是否需要指定摘要div输入字段的值?您希望在用户提交时获取表单值,然后将div输入值设置为这些值,对吗?如果所有内容都在同一个页面上,则只需要一些javascript即可实现这一点。form和Summy DIV是否在同一个视图中?
$('#form').submit(function() {
// set our summary div inputs values with our form values
$('firstname2').val($('firstname').val());
$('email2').val($('email').val());
$('phone2').val($('phone').val());
});
<form method="post" action="{{url('/vpage')}}">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<label>First Name</label>
<input type="text" name="firstname" placeholder="First Name" value="{{$user->firstname}}">
<label>Email Address</label>
<input type="text" name="email" placeholder="Email Address" value="{{$user->email}}">
<label>Phone Number <span> (optional)</span></label>
<input type="text" name="phone" placeholder="(888) 888-888" value="{{$user->phone}}">
<button id="hitme" class="submitBTN getstart" type="submit" onclick='return false;'> Get Started</button>
</form>
@if($Data->input('firstname'))
<p>SUMMARY</p>
<div class="sfieldz w100">
<label>Name:</label>
<input id="firstname2" type="text" placeholder="John Smith" value="{{$Data->input('firstname')}}">
</div>
<div class="w100">
<label>Email Address:</label>
<input id="email2" type="text" placeholder="johnsmith@gmail.com" value="{{$Data->input('email')}}" >
</div>
<div class="w100">
<label>Phone Number:</label>
<input id="phone2" type="text" placeholder="(888) 888-888" value="{{$Data->input('phone')}}">
</div>
@endif
function vpageController(Request $r){
return view("path.to.view",['Data'=>$r]);
}
Route::Route::match(['POST', 'GET'],'/vpage', 'ControllerName@vpageController');