我正在学习基于模型,视图,控制器范例的Laravel PHP框架。我一直试图将AJAX融入我的简单入门应用程序......一个电话呼叫记录器。这是我通常放弃的地方。但我拒绝了!
所以我有我的Phonecall模型:
class Phonecall extends Eloquent
{
// Creates an instance of the database object
}
这是我的电话呼叫表:
mysql> desc phonecalls;
+------------+------------------+------+-----+---------+----------------+
| Field | Type | Null | Key | Default | Extra |
+------------+------------------+------+-----+---------+----------------+
| id | int(10) unsigned | NO | PRI | NULL | auto_increment |
| who | varchar(200) | NO | | NULL | |
| what | varchar(200) | NO | | NULL | |
| created_at | datetime | NO | | NULL | |
| updated_at | datetime | NO | | NULL | |
| initiator | varchar(200) | NO | | NULL | |
| info | text | NO | | NULL | |
+------------+------------------+------+-----+---------+----------------+
7 rows in set (0.00 sec)
我的视图列出了当前数据库中的所有呼叫(由谁和什么组成):
<!doctype html>
<html>
<head>
<title>Title</title>
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js">
</script>
</head>
<body>
<h1>Welcome</h1>
<p>Here's a list of recent phonecalls</p>
<ul class="call-list">
@foreach($phonecalls as $call)
<li>{{ $call->who }} - {{ $call->what }} -
<a href="phonecalls/show/{{ $call->id }}">Show</a> |
{{ HTML::link('phonecalls/delete/'.$call->id, 'Delete') }} |
{{ HTML::link('phonecalls/update/'.$call->id, 'Update') }}
</li>
</ul>
{{-- Placeholder for AJAX content --}}
<div id="call-info">
</div>
</body>
</html>
这是我简单的控制器:
class Phonecalls_Controller extends Base_Controller {
// Use $this within a method the same way you
// would use the object name outside of the class
public function get_index()
{
$phonecalls = Phonecall::all();
return View::make('phonecalls.index')->with('phonecalls', $phonecalls);
}
// ************************************
// DISPLAY CALL INFO
public function get_show($call_id)
{
$call = Phonecall::find($call_id);
// WHAT GOES HERE?
}
我希望用户能够在视图中单击“显示” 将呼叫信息显示在...
中<div id="call-info">
</div>
视图中的标签。
这就是它的作用......
我的get_show()方法
// ************************************
// SHOW CALL INFO
public function get_show($call_id)
{
$call = Phonecall::find($call_id);
return $call->info;
}
我的Javascript
//************************************
// Phonecall AJAX Example
//************************************
$(document).ready(function() {
$('.call-list > li > a').click(function(e) { // e=event
e.preventDefault();
var id = $(this).attr('id');
$.get(BASE+'/phonecalls/show/'+id, function(data) {
$("#call-info").html(data);
})
});
答案 0 :(得分:5)
我花了一段时间才弄清楚,因为webz中的示例有点令人困惑,因为它引用了更改headers
来代替csrf
令牌等等。这是一个例子,我希望它可以帮助别人。
首先:您视图中的表单:
{{ Form::open(['id' => 'testForm']) }}
<p>{{ Form::label('title', 'Title') }}
{{ Form::text('title') }}</p>
<p>{{ Form::label('description', 'Description') }}
{{ Form::text('description') }}</p>
<p>{{ Form::submit('Submit') }}</p>
{{ Form::close() }}
第二:在route.php
中写下你的路线:
Route::post('ad', 'AdController@store');
第三:控制器:
public function store()
{
if(Request::ajax()){
$ad = new ad;
$ad -> title = Input::get('title');
$ad -> description = Input::get('description');
$ad -> save();
$response = array(
'status' => 'success',
'msg' => 'Option created successfully',
);
return Response::json( $response );
}
}
第四:jquery ajax请求:
$('form#testForm').submit(function(e){
e. preventDefault();
var str1 = $('input[name="title"]').val();
var str2 = $('input[name="description"]').val();
var str3 = $('input[name="_token"]').val();
var data = {title:str1,description:str2, token:str3};
//console.log(data);
var request = $.ajax({
url: "ad",
type: "POST",
data: data ,
dataType: "html"
});
request.done(function( msg ) {
var response = JSON.parse(msg);
console.log(response.msg);
});
request.fail(function( jqXHR, textStatus ) {
console.log( "Request failed: " + textStatus );
});
});
多数民众赞成吧。为了保护,您可以将控制器中的Session::token() == Input::get('_token')
设置为if check。
这只是一个可以帮助您入门的示例。使用绝对URL可能是必要的(在这种情况下使用http://www.pretty.url/ad
)www.pretty.url是您的localhost
或本地私人开发网址。
答案 1 :(得分:4)
这可以通过多种方式完成。
首先,你可以这样做:
public function get_show($call_id)
{
$call = Phonecall::find($call_id);
return View::make('phonecalls.single')->with('phonecal', $call);
}
在这种情况下,您需要为单个电话呼叫创建模板并将其放入phonecalls文件夹中。
另一个选择是从Laravel应用程序返回JSON响应:
public function get_show($call_id)
{
$call = Phonecall::find($call_id)->first();
return Response::eloquent($call);
}
另一种选择是使用javascript MVC框架来轻松获取/更新AJAX数据,例如Backbone JS或Angular JS可以做到这一点。
无论哪种方式,如果你想要做AJAX数据,你需要建立一个API来分隔常规站点和AJAX数据后端。
这是我的博客文章,其中包含有关如何完成此操作的大量详细信息: http://maxoffsky.com/code-blog/building-restful-api-in-laravel-start-here/
另外,在Laravel中对AJAX的一个很好的介绍是Dayle Rees的Code Happy,AJAX内容章节: codehappy.daylerees.com/ajax-content
如果您有更多问题,请告诉我,如果您觉得我有所帮助,请批准此评论。谢谢!
更新:
要从控制器(或Laravel路径)实际加载内容,您需要使用jQuery ajax,GET(加载数据)或POST(发布表单结果) 这是一个例子:
$('#get-info').click(function(e) { // e=event
e.preventDefault();
var BASE = "<?php echo URL::base(); ?>";
// attempt to GET the new content
$.get(BASE+'phonecalls/show/2', function(data) {
$('#content').html(data);
});
答案 2 :(得分:0)
您必须能够拦截“显示”链接上的点击次数。如果您制作控制器restful,则应该很容易向控制器发出ajax请求。
您必须在显示链接上的用户ajax request发送clicks。
我建议您将结果输出为JSON,以便以后使用js输出结果非常容易。