Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve docs / add tuturial #23

Closed
Tumi-D opened this issue Apr 25, 2020 · 8 comments
Closed

Improve docs / add tuturial #23

Tumi-D opened this issue Apr 25, 2020 · 8 comments
Assignees
Labels
enhancement New feature or request

Comments

@Tumi-D
Copy link

Tumi-D commented Apr 25, 2020

DataTables warning: table id=laravelDataTable5ea4749c0bd1f - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1

@wimurk
Copy link
Contributor

wimurk commented Apr 28, 2020

@Tumi-D hi,

Can you provide some more information? The Invalid JSON response means that your json reponsive is invalid. Can you share your controller and tableModel?

@wimurk wimurk self-assigned this Apr 28, 2020
@wimurk wimurk added the question Further information is requested label Apr 28, 2020
@Tumi-D
Copy link
Author

Tumi-D commented Apr 28, 2020

I switched to using livewire I honestly just didn't get the tutorial. Your package would have saved me an eternity tho. I will take my time to understand and use it on my next project. Thanks still !. But I hope a simple step by step guide would be made available in the not too distant future.

@Tumi-D Tumi-D closed this as completed Apr 28, 2020
@wimurk wimurk changed the title I tried using your package but I get this error please improve on the docs or a link to a more hands on tutorial will be much appreciated .Thank you Improve docs / add tuturial Apr 29, 2020
@wimurk
Copy link
Contributor

wimurk commented Apr 29, 2020

Hi, the docs don't include a tutorial but it is a good idea to create one. I will reopen and edit your question.

@wimurk wimurk reopened this Apr 29, 2020
@wimurk wimurk added enhancement New feature or request and removed question Further information is requested labels Apr 29, 2020
@wimurk wimurk added this to the 3.1.0 php 7.4 update milestone Apr 29, 2020
@wimurk
Copy link
Contributor

wimurk commented Apr 29, 2020

#22 Adding turorial github.pages tutorial

@wimurk
Copy link
Contributor

wimurk commented Apr 29, 2020

Hi @Tumi-D,

Checkout the tutorial here. Could you please check it out and let me know if anything is incorrect

@Tumi-D
Copy link
Author

Tumi-D commented Apr 30, 2020

Thanks a lot! Like that, you took the time to add the tutorial
However, it still didn't work.

The things I feel will make the tutorial better

  1. You use this command

php artisan make:table-model UsersTable --buttons --translations --route=users --query

To create the tableModel (UsersTable class ) yet when referencing in the UsersController Class which should be specified on the onset of the tutorial as a resource you simply call the class Users:: class
instead of UsersTable::class

  1. I don't know where this class is coming from \DataTable. My Intellisense suggests \SingleQuote\DataTables\DataTable
    If this is the actual class the is no static method called model in it. I tried instantiating a new class to call the model method it just works the same as me calling the static model.

  2. A hint to use laravel/ui to generate the basic app scaffolding

4)In the Filling your table column a missing comma after the email

public $columns = [ 'id', 'name', 'email', 'created_at' ];

5)A little funny grammatical error showen I think you meant shown.

Back To My Code
I kinda stopped reading at ### Filling the table model

  • My Controller
<?php

namespace App\Http\Controllers;

use App\User;
use Illuminate\Http\Request;
use \SingleQuote\DataTables\DataTable as DataTable;

class UserController extends Controller
{

    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {

        // $simpledatatable = new DataTable();

        // $datatable = $simpledatatable->model(User::class);
        // dd($datatable);
        $datatable = \DataTable::model(User::class)->tableModel(\App\TableModels\UsersTable::class);

        return view('users.index')->with(compact('datatable')); //⇐ pass the variable to the view
    }
}

  • My tableModel
<?php

namespace App\TableModels;

use Illuminate\Support\Facades\Date;
use SingleQuote\DataTables\Controllers\ColumnBuilder;
use SingleQuote\DataTables\Fields\Button; //button field
use SingleQuote\DataTables\Fields\Date as FieldsDate;

/**
 * TableModel for SingleQuote\DataTable
 * See the full focs here for the table models
 * https://singlequote.github.io/Laravel-datatables/table-models
 */
class UsersTable extends ColumnBuilder
{

    // @var array
    public $tableClass = "table table-bordered";


    /**
     * Set the columns for your table
     * These are also your header, searchable and filter columns
     *
     * @var array
     */
    public $columns = [
        'id',
        'name',
        'email',
        'created_at'
    ];


    /**
     * Set the translation columns for the headers
     *
     * @return array
     */
    public function translations(): array
    {
        return [
            'name' => trans('Name'),
        ];
    }


    /**
     * Run an elequent query
     *
     * @param \Illuminate\Database\Query\Builder $query
     * @return \Illuminate\Database\Query\Builder
     */
    public function query($query)
    {
        return $query;
    }


    // /**
    //  * Alter the fields displayed by the resource.
    //  *
    //  * @return array
    //  */
    // public function fields(): array
    // {
    //     return [
    //         // Button::make('id')->class('my-button-class')->route('users.show', 'id'),
    //         // Button::make('id')->class('my-button-class')->route('users.edit', 'id'),
    //         // Button::make('id')->class('my-button-class')->method('delete')->route('users.destroy', 'id'),
    //     ];
    // }

    public function fields(): array
    {
        return [
            FieldsDate::make('created_at')->format('d-m-Y') //dd-mm-YYYY
        ];
    }
}


  • My View

@extends('layouts.app')
@section('content')
<!-- Begin Page Content -->
<div class="container-fluid">
    <div class='row'>
        <div class="col-xl-12">
            <div class="card">
                <div class="card-body">
                    {!! $datatable->table() !!}
                </div>
            </div>
        </div>
    </div>
</div>
<!-- /.container-fluid -->
@endsection

@push('js')
{!! $datatable->script() !!}
@endpush

Unfortunately I probably missed something ! Final Output

Screenshot (56)

@wimurk
Copy link
Contributor

wimurk commented May 6, 2020

Thank you for trying the tuturial.

  1. the DataTable as explained in the tutorial, requires 2 classes. First the model requires an eloquent Model like the User model. Second the actual tableModel you create using the command.

  2. This is basic laravel. The \DataTable is a facade you can use. Read the docs here instead of calling the whole class ($datatable = new \SingleQuote\DataTable\DataTable) you can simply call the facade.

  3. The packages doesn't rely on the ui or any Auth classes. Passing the User model which can be whatever the developer codes.

As for 4 and 5. Thanks :-)

I copied and tested your code. I don't see any errors popping up and it works like a charm.
Can you provide the response the request returns?

@wimurk wimurk closed this as completed May 25, 2020
@wimurk
Copy link
Contributor

wimurk commented May 25, 2020

Closed issue for inactivity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants