How to use tooltip action button in datatable


I want to add tooltip on my button view. This is the view:
view

I process the data using serverside & ajax datatable, This is my js for call data:

var table = $('.diagnosis-table').DataTable({
                    processing: true,
                    serverSide: true,
                    responsive: true,
                    ajax: "/claim/claimDiagnosis/" + lastSegment,
                    dom: '<"top"fB>rt<"bottom"lip><"clear">',
                    columns: [{
                            data: 'diagnosis_id',
                            name: 'diagnosis_id'
                        },
                        {
                            data: 'name',
                            name: 'name'
                        },
                        {
                            data: 'action',
                            name: 'action',
                            orderable: false,
                            searchable: false
                        },
                    ],
                    "lengthMenu": [
                        [10, 25, 50, -1],
                        [10, 25, 50, "All"]
                    ],
                });

This is the method for handle data to send data in controller:

if ($request->ajax()) {
        // dd($request);
        return Datatables::of($data)
            ->addIndexColumn()
            ->addColumn('action', function ($row) {
                $btn = '
                        <a
                            class="text-primary mr-3 edit actionEdit editItem" href="javascript:void(0)"
                            data-id="' . $row->id . '"
                            data-toggle="modal" id="updateItem">
                            <i class="fas fa-edit"></i>
                        </a>
                        <a
                            class="text-danger mr-3 actionDelete deleteItem" href="javascript:void(0)"
                            id="' . $row->id . '" data-original-title="Delete"
                            data-target="#deleteQuotation' . $row->id . '">
                            <i class="fas fa-trash"></i>
                        </a>
                        <a
                            class="text-success mr-3" href="javascript:void(0)"
                            id="' . $row->id . '" data-original-title="Delete"
                            data-target="#' . $row->id . '">
                            <i class="fas fa-check-circle"></i>
                        </a>';
                return $btn;
            })
            ->rawColumns(['action'])
            ->removeColumn('id')
            ->make(true);
    }

How to use tooltip in fas fa-check-circle button? I try to use titleAttr and Ellipsis renderer but cant work properly

Source: JavaSript – Stack Overflow

November 30, 2021
Category : News
Tags: ajax | datatable | javascript | laravel

Leave a Reply

Your email address will not be published. Required fields are marked *

Sitemap | Terms | Privacy | Cookies | Advertising

Senior Software Developer

Creator of @LzoMedia I am a backend software developer based in London who likes beautiful code and has an adherence to standards & love's open-source.