How to trim a string in a yajra datatable used a raw query in laravel - laravel

Question

I have a problem on how to trim string in my datatable from a query where in used a raw query to get data from the database.
my query example is
public function data()
{
return DB::table('query_table')
->select([
DB::raw('query_table.data1 AS data1'),
DB::raw('query_table2.data2 AS data2'),
])
->join('query_table2','query_table2.query_table_id','=','query_table.id')
->where(['query_table.id' => 1])
->orderByDesc('query_table.data1')
->get();
}
from controller for my data table
public function dataDataTable()
{
$data = $this->query->data(); //query of data
return DataTables::of($data)
->addIndexColumn()
->make(true);
}
I am using datatables as view in laravel
#extends('layouts.main' , ['title' => trans('label.data.table')])
#include('includes.datatable_assets')
#push('after-styles')
#include('includes.custom_assets')
#endpush
#section('content')
<div class="card">
<div class="card-body">
<header class="card-header card-header-custom">
<h2 class="card-title" style="color: white" >{!! trans('label.table.header') !!}</h2>
</header>
<div class="" id="list-all">
<table class="display" id="templates-table">
<thead>
<tr>
<th>#lang('label.sn')</th>
<th>#lang('label.data1')</th>
<th>#lang('label.data2')</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
#endsection
#push('after-scripts')
<script type="text/javascript">
$('#templates-table').DataTable({
processing: true,
serverSide: true,
ajax: '{!! route('query.datatable.route') !!}',
type: 'get',
columns: [
{data: 'DT_RowIndex', name: 'DT_RowIndex', orderable: false, searchable: false, width: '5%'},
{data: 'data1', name: 'data1', orderable: false, searchable: true, width: '65%'},
{data: 'data2', name: 'data2', orderable: false, searchable: true, width: '35%'},
],
</script>
#endpush
How do I trim data1 string so as can be seen with few characters in my datatable view ?

Answer 1

You can either do it in PHP or in Javascript:
Javascript:
$('#templates-table').DataTable({
...,
columnDefs: [{
targets: 1,
render: function (data, type, row) {
return type === 'display' && data.length > 50 ? data.substr(0, 50) + '…' : data;
}
}]
});
You can read more about it here.
PHP:
use Illuminate\Support\Str;
public function dataDataTable()
{
$data = $this->query->data(); // query of data
return DataTables::of($data)
->editColumn('data1', function ($data) {
return Str::limit($data->data1, 50);
})
->addIndexColumn()
->make(true);
}
If you don't have to show the user the full string I would use the PHP version, so your response does not get bloated.