Search code examples
phptwitter-bootstraplaravellaravel-5.1x-editable

x-editable on laravel: not seeing changes applied


Giving x-editable a shot with my Laravel 5.1 website. I have a list of text titles listed as table rows. I followed the documentation. I can see the edit form for the text field pop up when I click the title. I change text and submit. Popup disappears as expected, new text shows. But the database was not updated. I made sure to set the data-url to the post action I need. Made sure to add a route for it. Made sure to have a method in my controller to handle the request, update the database and redirect (not sure if the redirect is necessary). Here's a snippet of a single row, I hardcoded title and its id for simplicity.

<a href="#" class="task-editable-name" id="task-editable-name" data-type="textarea" data-url="/task/2/edit" data-title="">Solve x-editable bug</a>


$(document).ready(function() {
    $.fn.editable.defaults.mode = 'popup';     

    $('.task-editable-name').editable({
        placement: 'bottom',
        rows: 3
    });
});


Route::post('/task/{task}/edit', 'TaskController@edit');


public function edit(Request $request, Task $task)
{
    $task->name = $request['value'];
    $task->save();
    return redirect('/tasks');
}

Solution

  • I solved my issue. I had to do three things:

    add this to the js that handles the x-editable:

    $.fn.editable.defaults.send = "always";
    

    include the following meta and script per laravel documentation:

    <meta name="csrf-token" content="{{ csrf_token() }}" />
    <script type="text/javascript">
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
    </script>
    

    access the x-editable value directly from $request in my controller:

    public function edit(Request $request, Task $task)
    {
        $task->name = $request->value; // instead of $request->input('value')
        $task->save();
    }
    

    Thanks guys for your replies, and Hope this helps someone out there!