[英]simple form submit by ajax in laravel and after, insert new row into existing table with data from submited form
表单的细分在没有ajax的情况下可以正常工作,但是我需要在不刷新的情况下发送表单(通过ajax),此后,这2个输入首先要插入数据库中,并使用来自表单的那些数据插入新行。 这是我的尝试。 提交表单时无需刷新,它插入数据库中,但是在细分后它没有显示在我想要的表中,而且我找不到完整的示例,因此请帮助我。 并感谢您的建议。
控制器功能:
public function newClient(){
if(Request::ajax()){
$nume=Input::get('add_nume');
$tel=Input::get('add_telefon');
$client=new Clienti;
$client->nume=$nume;
$client->telefon=$tel;
$client->save();
}
}
路线:
Route::get('/clienti/', 'HomeController@showClienti');
Route::post('/adaugaclient', 'HomeController@newClient');
视图中的脚本:
<script>
$(document).ready(function(){
$('form[data-remote]').on('submit', function(e){
var form = $(this);
var url = form.prop('action');
var clienti=$('#add_clienti');
$.ajax({
url:url,
data:form.serialize(),
type: 'POST',
dataType: "json",
success: function(data){
console.log('data');
//i want to insert in table #listaclienti at the end of it
}
});
return false;
});
});
从我提交的地方里面的表格形式:
<div id='adauga_client'>
<!--
<form method='post' action='adaugaclient' id='add_customer'>
-->
{{Form::open(['data-remote'])}}
<table border='1' id='adaugaclient'>
<thead >
<tr>
<td colspan='2'>Adauga client</td>
</tr>
</thead>
<tbody>
<tr>
<td><label for="add_nume">Nume</label></td>
<td class='right'>
<input name="add_nume" type="text" id="add_nume" value="">
</td>
</tr>
<tr>
<td><label for="add_telefon">Telefon</label></td>
<td class='right'><input name="add_telefon" type="text" id="add_telefon" value=""></td>
</tr>
<tr>
<td colspan='2'><input name="add_btn" type="submit" id='add_client' value="Adauga client" class="add_btn" ></td>
</tr>
</tbody>
</table>
{{Form::close()}}
</div>
我要在其中插入数据的表:
<div id='clienti'>
<table border="1" id='listaclienti' align="center">
<thead>
<tr>
<td>Nume</td>
<td>Telefon</td>
<td>Modifica</td>
<td>Sterge</td>
</tr>
</thead>
<tbody>
@foreach($clienti as $client)
<form method="post" action="{{ URL::to('/clienti/modifica/'. $client->id) }}" accept-charset="UTF-8">
<tr>
<td><input type='text' name='nume' id='nume' value='{{$client->nume}}'></td>
<td><input type='text' name='telefon' id='telefon' value='{{$client->telefon}}'></td>
<td><button type='submit'>Modifica</button></td>
<td><a href="clienti/sterge/{{$client->id}}"><button type='button'>Sterge</button></a> </td>
</tr>
</form>
@endforeach
</tbody>
</table>
</div>
首先,您需要返回刚从控制器保存的数据。 您可以为此使用Laravels Response::json()
。
public function newClient(){
if(Request::ajax()){
// ....
return Response::json($client);
}
}
之后,您应该在成功回调中接收模型的JSON表示形式作为data
。 然后,这只是基本的jQuery。 创建表元素并将其附加到表中。 我不会为您编写所有代码,但这是您访问数据的方式。 您应该能够自己找出其余的部分。
$.ajax({
url:url,
data:form.serialize(),
type: 'POST',
dataType: "json",
success: function(data){
console.log(data); // json of your laravel model
console.log('Num: ', data.num); // access property
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.