Как вызвать метод редактирования контроллера ресурсов с помощью AJAX в Laravel5.6 - PullRequest
Новая
       13

Как вызвать метод редактирования контроллера ресурсов с помощью AJAX в Laravel5.6

0 голосов
/ 14 мая 2018

В моем проекте laravel я использую контроллер ресурсов для обновления. Но это не работает. Я пытался, но это не удалось.

мой клинок 

<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
    <title>{{ config('app.name') }}</title>
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('css/style.css') }}" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="container">
    <h1>{{ config('app.name') }}</h1>
    <form class="dis-none" id="FormAjax">
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="name">Name</label>
                    <input type="text" class="form-control" id="name" />
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    <label for="address">Address</label>
                    <textarea class="form-control" rows="3" id="address"></textarea>
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    <label for="country">Country</label>
                    <input type="text" class="form-control" id="country" />
                </div>
            </div>
        </div>
        <button type="submit" id="SaveAjax" class="btn btn-success">Save Form</button>
        <button type="button" id="cancel" class="btn btn-danger">Cancel</button>
    </form>
    <div id="ShowAjax" class="row">
        <button type="button" id="AddForm" class="btn btn-success">Add Form</button>
        <table class="table">
            <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Address</th>
                <th>Country</th>
                <th>Action</th>
            </tr>
            </thead>
            <tbody id="data">
            </tbody>
        </table>
    </div>
</div>

<script type="text/javascript" src="{{ asset('js/app.js') }}"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $("#AddForm").click(function () {
            $("#FormAjax").fadeIn();
            $("#ShowAjax").hide();
            $('#UpdateForm').text('Save Form');
        });
        $("#SaveAjax").click(function () {
            $("#FormAjax").hide();
            $("#ShowAjax").fadeIn();
        });
        $(document).on('click', '#cancel', function () {
            $('#name').val('');
            $('#country').val('');
            $('#address').val('');
        });
        $(document).on('click', '#edit', function () {
            $("#FormAjax").fadeIn();
            $("#ShowAjax").hide();
            name = $(this).parent().parent().find('#ename').text();
            address = $(this).parent().parent().find('#eaddress').text();
            country = $(this).parent().parent().find('#ecountry').text();
            $('#name').val(name);
            $('#address').val(address);
            $('#country').val(country);
            $('#SaveAjax').text('Edit');
            $('#SaveAjax').prop('id', 'UpdateForm');
            $('#UpdateForm').attr('data-id', $(this).data('id'));
        });
        $(document).on('click', '#UpdateForm', function () {
            name = $('#name').val();
            country = $('#country').val();
            address = $('#address').val();
            url = "peoples";
            id = $(this).data('id');
            editUrl = url + '/' + id + '/edit';
            $.get( {{ route('editUrl') }}, {name:name, country:country, address:address, id:id}, function (data) {
                console.log('success');
            });
        });
    });
</script>
</body>
</html>

Маршрут / web.php 

Route::resource('peoples', 'PeopleController');

PeopleController.php 

public function edit(People $people)
    {
        if($request->ajax()) {
            $request->validate([
                'name' => 'required',
                'address' => 'required',
                'country' => 'required',
            ]);

            $people = People::find($request->id);
            $people->name = $request->name;
            $people->address = $request->address;
            $people->country = $request->country;
            $people->save();

            return response()->json();
        }
    }

Когда я пытаюсь ввести в браузере http://localhost:8000/peoples, я вижу эту ошибку.

Маршрут [editUrl] не определен. (Просмотр: C: \ xampp \ htdocs \ Tutorials Laravel \ Ajax \ ресурсы \ вид \ peoples.blade.php)

Ответы [ 2 ]

0 голосов
/ 15 мая 2018

Я написал код следующим образом. Это не сработало. Это правильно? 

$(document).on('click', '#UpdateForm', function () {
            name = $('#name').val();
            country = $('#country').val();
            address = $('#address').val();
            url = "{{ route('peoples.store') }}" + '*apiPrefix*' + '/peoples/' + id + '/edit';
            id = $(this).data('id');
            editUrl = url + '/' + id + '/edit';
            $.get( editUrl ), {name:name, country:country, address:address, id:id}, function (data) {
                console.log('success');
            });
        });
0 голосов
/ 15 мая 2018

Вы не можете использовать помощник route() здесь, так как вы не назвали свои маршруты.Вместо этого попробуйте использовать помощник url() для генерации URL. 

url(id . '/edit')

Но здесь я вижу еще одну проблему, так как идентификатор будет входить динамически, когда JS выполнится, и к этому времени помощник Laravel уже будетказнены.Итак, я бы предложил следующий подход: 

url = {{ base_url() }} + '*apiPrefix*' + '/peoples/' + id + '/edit'
...