Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add row number or Serial no in laravel datatable

This is the bill_info table, for which i need to serialized row no like 1 2 . . . . . . . . . . . . .n

enter image description here

There is data list returned, how I can get serial_no custom field in datatable list view.

    $data = BillInfo::get(['bill_info.*']);

    return Datatables::of($data)
                    ->removeColumn('id')
                    ->make(true);
like image 270
Majbah Habib Avatar asked Feb 08 '17 08:02

Majbah Habib


4 Answers

If you are using yajra laravel datatables

Just add ->addIndexColumn()

return DataTables::of($data)
            ->addIndexColumn()
            ->make(true);

In your javascript, you can set the first row as a serial number like this

columns: [
            { data: 'DT_RowIndex', name: 'DT_RowIndex', orderable: false, searchable: false },
            { data: 'name', name: 'name' },
            { data: 'action', name: 'action' }
        ]

use DT_Row_Index instead of DT_RowIndex for older yajra datatable version

like image 82
Abhinav Saraswat Avatar answered Nov 12 '22 20:11

Abhinav Saraswat


You can see my code :

<table id="datatable" class="table table-bordered table-striped">
                            <thead>
                            <tr>
                                <th>Sl No</th>
                                <th>Invoice No</th>
                                <th>Customer</th>
                                <th>Total Price</th>
                                <th>Paid</th>
                                <th>Due</th>
                                <th>Discount</th>
                                <th>Action</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>

And the script part:

<script type="text/javascript">
        $(function() {
            var i = 1;
            var table = $('#datatable').DataTable({
                processing: true,
                serverSide: true,
                ajax: "{{ route('collections') }}",
                columns: [{
                    "render": function() {
                        return i++;
                    }
                },
                    {
                        data: 'issue_no',
                        name: 'issue_no'
                    },
                    {
                        data: 'customer_name',
                        name: 'customer_name'
                    },
                    {
                        data: 'total_order_price',
                        name: 'total_order_price'
                    },
                    {
                        data: 'paid_amount',
                        name: 'paid_amount'
                    },
                    {
                        data: 'due_amount',
                        name: 'due_amount'
                    },
                    {
                        data: 'discount_amount',
                        name: 'discount_amount'
                    },
                    {
                        data: 'action',
                        name: 'action',
                        orderable: false,
                        searchable: false
                    }
                ],
                createdRow: function ( row, data, index ) {
                    if (data['due_amount'] > 0) {
                        $('td', row).eq(4).css('background-color', '#f4511e','color','#ffffff');
                        $('td', row).eq(4).css('color','#ffffff');
                    } else {

                    }
                    $('td', row).eq(3).addClass('text-right');
                    $('td', row).eq(4).addClass('text-right');
                    $('td', row).eq(5).addClass('text-right');
                    $('td', row).eq(6).addClass('text-right');
                }
            });

        });
    </script>

In the rendering part, you can add the auto-increment field

{
  "render": function() {
      return i++;
     }

},

like image 26
K. M. Shawkat Zamil Avatar answered Oct 17 '22 06:10

K. M. Shawkat Zamil


When using Yajra Laravel datatables

return DataTables::of($result)
            ->addIndexColumn()
            ->make(true);

"columns": [
                {
                    "data": 'DT_RowIndex',
                    orderable: false, 
                    searchable: false
                },
]
like image 6
Thanushka Avatar answered Nov 12 '22 20:11

Thanushka


Set the variable rownum at the beginning of your query. Then set the increment process in your query.

DB::statement(DB::raw('set @rownum=0'));

$data = BillInfo::get(['bill_info.*', 
                    DB::raw('@rownum  := @rownum  + 1 AS rownum')]);

return Datatables::of($data)
                ->removeColumn('id')
                ->make(true);

Here you can get rownum as serial no of the given records [1 . . . 8].

like image 4
Ishrat Sharmin Avatar answered Nov 12 '22 20:11

Ishrat Sharmin