laravel 如何在不刷新laravel页面的情况下发送数据?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/47831909/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to send data without refreshing page in laravel?
提问by Hemanth
I need send data to the database without refreshing page.
我需要在不刷新页面的情况下将数据发送到数据库。
Home Blade :
家庭刀片:
<form class="chat" id="message" action="#" method="post">
<input type="hidden" name="_token" id="_token" value="{{ csrf_token() }}">
<li>
<div class="panel-footer">
<div class="input-group">
<input type="text" name="message" class="" placeholder="Type your message here..." />
<span class="input-group-btn">
<button type="submit" class=" btn-success btn-sm searchButton" id="save" >
Send
</button>
</span>
</div>
</div>
</li>
</form>
Controller :
控制器 :
public function message(Request $data)
{
$ins = $data->all();
unset($ins['_token']);
$store = DB::table("chatbox")->insert([$ins]);
return Redirect('Users/home')->with('message',"success");
}
Ajax :
阿贾克斯:
<script>
$(document).on("click", ".save", function() {
$.ajax({
type: "post",
url: '/Users/message',
data: $(".message").serialize(),
success: function(store) {
},
error: function() {
}
});
});
</script>
At present when I send data it is automatically refreshing the whole page but only the particular form need to be refreshed.
目前,当我发送数据时,它会自动刷新整个页面,但只需要刷新特定的表单。
回答by Zakaria Acharki
You should change the type of the button from submit
to button
like :
您应该将按钮的类型从更改submit
为button
like :
<button type="button" class=" btn-success btn-sm searchButton" id="save" >end</button>
Or prevent the default action (submit
) using e.preventDefault();
like :
或者submit
使用e.preventDefault();
like阻止默认操作 ( ) :
$(document).on("click",".save",function(){
e.preventDefault(); //Prevent page from submiting
...
...
});
NOTE :Note also that you don't have button with class save
but with id save
so the event handler should looks like :
注意:另请注意,您没有带 classsave
但带 id 的按钮,save
因此事件处理程序应如下所示:
$(document).on("click", "#save", function(){
________________________^
回答by Paul
You have to handle function inside javascript/jquery form submit
funtion and use e.preventDefault()
to stop HTML to submit the form.
您必须在 javascript/jquery 表单submit
功能中处理函数并使用e.preventDefault()
停止 HTML 来提交表单。
Try your ajax code in the below code type.
在下面的代码类型中尝试您的 ajax 代码。
$('#message').submit(function(e) {
e.preventDefault();
//your ajax funtion here
});
You can reset/refresh your form in success function
您可以在成功功能中重置/刷新表单
$("#message").trigger("reset");
回答by linktoahref
You need to prevent the default form submission, and use the script instead
您需要阻止默认表单提交,并使用脚本代替
$(document).on("click", "#save", function(e) {
e.preventDefault(); // Prevent Default form Submission
$.ajax({
type:"post",
url: '/Users/message',
data: $("#message").serialize(),
success:function(store) {
location.href = store;
},
error:function() {
}
});
});
and instead of returning a redirect, return the url from the controller and let the script handle the redirect
并且不返回重定向,而是从控制器返回 url 并让脚本处理重定向
public function message(Request $data)
{
$ins = $data->all();
unset($ins['_token']);
$store = DB::table("chatbox")->insert([$ins]);
session()->flash('message', 'success');
return url('Users/home');
}
回答by common sense
Remove return Redirect('Users/home')->with('message',"success");
and just return an array like
删除return Redirect('Users/home')->with('message',"success");
并返回一个数组,如
return ['message' => 'success'];