PlayHardGoPro
PlayHardGoPro

Reputation: 2933

Ajax on JQuery drag event

I'm creating a nested list with data from database. On this list, I'm using the JQuery UI Drag effect. What I need to do is when the drag is over, it will update the database.

The list coints Professor's name and his ID, it has as sub-list with his classes, like:

John teaches Math & physics, Dwayne teaches English.

John
*Physics
*Math

Dwayne
*English

Let's say I want to give Math class to Dwayne. So I'll drag Math from John and drop it on Dwayne sub-list. It's working fine.
What I can't do is to make the update on database, because John no longer teaches Math instead John is going to teach it. So I need to make an update there or a delete+insert.

Obs: I'm using laravel

Here is my Code:

@extends('app')

@section('assets')
    <script type="text/javascript" src="{{ URL::to('/js/jquery.mjs.nestedSortable.js') }}"></script>
@stop

@section('content') 
    <ol>
        @foreach($professores as $prof)
            <li data-id=" {{ $prof->id }}">
                {{ $prof->nome }}
                <ol class="list-disc">
                    @foreach($prof->disc as $disc)
                        <li data-id="{{ $disc->id }}">{{ $disc->nome }}</li>
                    @endforeach
                </ol>
            </li>
        @endforeach
    </ol>

    <script type="text/javascript">
        $(function(){
            var old_teacher;

            $('.list-disc').sortable({
                connectWith: '.list-disc',
                start: function (event, ui){
                    old_teacher = ui.item.parent().parent().attr('data-id');
                },
                stop: function (event, ui){
                    $.ajax({
                        type: "POST",
                        url: '{{ URL::to("/professor") }}',
                        data: {disc: ui.item.attr('data-id'), professor: ui.item.parent().parent().attr('data-id'), old: old_teacher},
                        success: function(data){
                            console.log(data);
                        }
                    });
                }
            });
        })
    </script>

@stop  

With this currently code, When I drop the item I get:

Internal Server Error (500)

UPDATE
Route File:

Route::post('professor', [
    'uses' => 'ProfessorController@postProfessorList'
    ]);  

Controller File:

public function postProfessorList()
{
    Professor::submit(Input::post('disciplina'), input::post('professor'),   input::post('old'));
} 

Log file: Update

local.ERROR: exception 'Symfony\Component\Debug\Exception\FatalErrorException' with message 'Call to undefined method Illuminate\Http\Request::post()' in F:\PathToProject\vendor\laravel\framework\src\Illuminate\Support\Facades\Facade.php:210

Upvotes: 0

Views: 141

Answers (1)

Internal Server Error (500) means that something is wrong with your server-side (laravel) code.

Can you provide us with the code which is used in POST: /professor ?

EDIT

You might want to check your logs in app/storage or storage/ (depending on the laravel version). They should give you a better description of the error that occurs.

Also, you should replace Input::post('...') with Input::get('...') laravel takes care of $_GET and $_POST variables automatically.

EDIT 2 The error you get is due to Laravels CSRF protection. You will need to set the csrf token in your ajax request like that:

data: {disc: ....., _token: '{{csrf_token()}}' }

Upvotes: 1

Related Questions