在Laravel中创建了一个页面,用于获取,删除和添加功能。因为我正在使用Alax

时间:2016-06-22 09:33:42

标签: ajax laravel-5

在Laravel中创建了一个用于获取,删除和添加功能的页面。因为我正在使用Alax。但是我收到了错误

FatalErrorException in routes.php line 15:Class 'Task' not found" 

任何人都可以告诉我为什么会收到此错误。 我的欢迎页面在下面给出

<!DOCTYPE html>
<html lang="en-US">
<head>
    <title>Ajax</title>

    <!-- Load Bootstrap CSS -->
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container-narrow">
    <h2>Laravel Ajax</h2>
    <button id="btn-add" name="btn-add" class="btn btn-primary btn-xs">Add New Task</button>
    <div>

        <!-- Table-to-load-the-data Part -->
        <table class="table">
            <thead>
            <tr>
                <th>ID</th>
                <th>Task</th>
                <th>Description</th>
                <th>Date Created</th>
                <th>Actions</th>
            </tr>
            </thead>
            <tbody id="tasks-list" name="tasks-list">
            @foreach ($tasks as $task)
                <tr id="task{{$task->id}}">
                    <td>{{$task->id}}</td>
                    <td>{{$task->task}}</td>
                    <td>{{$task->description}}</td>
                    <td>{{$task->created_at}}</td>
                    <td>
                        <button class="btn btn-warning btn-xs btn-detail open-modal" value="{{$task->id}}">Edit</button>
                        <button class="btn btn-danger btn-xs btn-delete delete-task" value="{{$task->id}}">Delete</button>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>
        <!-- End of Table-to-load-the-data Part -->
        <!-- Modal (Pop up when detail button clicked) -->
        <div class="modal fade" id="myModal" 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-label="Close"><span aria-hidden="true">×</span></button>
                        <h4 class="modal-title" id="myModalLabel">Task Editor</h4>
                    </div>
                    <div class="modal-body">
                        <form id="frmTasks" name="frmTasks" class="form-horizontal" novalidate="">

                            <div class="form-group error">
                                <label for="inputTask" class="col-sm-3 control-label">Task</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control has-error" id="task" name="task" placeholder="Task" value="">
                                </div>
                            </div>

                            <div class="form-group">
                                <label for="inputEmail3" class="col-sm-3 control-label">Description</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="description" name="description" placeholder="Description" value="">
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary" id="btn-save" value="add">Save changes</button>
                        <input type="hidden" id="task_id" name="task_id" value="0">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<meta name="_token" content="{!! csrf_token() !!}" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="{{asset('js/ajax-crud.js')}}"></script>
</body>
</html>

模型 Task.php

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Task extends Model
{
    protected $fillable = ['task', 'description','done'];
}

Ajax.js 是......

$(document).ready(function(){

var url = "/ajax-crud/public/tasks";

//display modal form for task editing
$('.open-modal').click(function(){
    var task_id = $(this).val();

    $.get(url + '/' + task_id, function (data) {
        //success data
        console.log(data);
        $('#task_id').val(data.id);
        $('#task').val(data.task);
        $('#description').val(data.description);
        $('#btn-save').val("update");

        $('#myModal').modal('show');
    })
});

//display modal form for creating new task
$('#btn-add').click(function(){
    $('#btn-save').val("add");
    $('#frmTasks').trigger("reset");
    $('#myModal').modal('show');
});

//delete task and remove it from list
$('.delete-task').click(function(){
    var task_id = $(this).val();

    $.ajax({

        type: "DELETE",
        url: url + '/' + task_id,
        success: function (data) {
            console.log(data);

            $("#task" + task_id).remove();
        },
        error: function (data) {
            console.log('Error:', data);
        }
    });
});

//create new task / update existing task
$("#btn-save").click(function (e) {
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
        }
    })

    e.preventDefault();

    var formData = {
        task: $('#task').val(),
        description: $('#description').val(),
    }

    //used to determine the http verb to use [add=POST], [update=PUT]
    var state = $('#btn-save').val();

    var type = "POST"; //for creating new resource
    var task_id = $('#task_id').val();;
    var my_url = url;

    if (state == "update"){
        type = "PUT"; //for updating existing resource
        my_url += '/' + task_id;
    }

    console.log(formData);

    $.ajax({

        type: type,
        url: my_url,
        data: formData,
        dataType: 'json',
        success: function (data) {
            console.log(data);

            var task = '<tr id="task' + data.id + '"><td>' + data.id + '</td><td>' + data.task + '</td><td>' + data.description + '</td><td>' + data.created_at + '</td>';
            task += '<td><button class="btn btn-warning btn-xs btn-detail open-modal" value="' + data.id + '">Edit</button>';
            task += '<button class="btn btn-danger btn-xs btn-delete delete-task" value="' + data.id + '">Delete</button></td></tr>';

            if (state == "add"){ //if user added a new record
                $('#tasks-list').append(task);
            }else{ //if user updated an existing record

                $("#task" + task_id).replaceWith( task );
            }

            $('#frmTasks').trigger("reset");

            $('#myModal').modal('hide')
        },
        error: function (data) {
            console.log('Error:', data);
        }
    });
});
});

route.php

   <?php

Route::get('/', function () {
    $tasks = Task::all();

    return View::make('welcome')->with('tasks',$tasks);
});

Route::get('/tasks/{task_id?}',function($task_id){
    $task = Task::find($task_id);

    return Response::json($task);
});

Route::post('/tasks',function(Request $request){
    $task = Task::create($request->all());

    return Response::json($task);
});

Route::put('/tasks/{task_id?}',function(Request $request,$task_id){
    $task = Task::find($task_id);

    $task->task = $request->task;
    $task->description = $request->description;

    $task->save();

    return Response::json($task);
});

Route::delete('/tasks/{task_id?}',function($task_id){
    $task = Task::destroy($task_id);

    return Response::json($task);
});

任何人都可以告诉我为什么会收到错误。

1 个答案:

答案 0 :(得分:0)

您需要在 routes.php 的顶部导入任务类,如下所示:

<?php

use App\Task;

Route::get('/', function () {
    ...
...