Laravel yajrabox relation sort

I have a project with laravel and datatable using yajrabox, it stuck in relationship sort

<?php

namespace AppDataTables;
use DB;
use AppModelsKabupaten;
use YajraDataTablesHtmlButton;
use YajraDataTablesHtmlColumn;
use YajraDataTablesHtmlEditorEditor;
use YajraDataTablesHtmlEditorFields;
use YajraDataTablesServicesDataTable;

class KabupatenDataTable extends DataTable
{
    /**
     * Build DataTable class.
     *
     * @param mixed $query Results from query() method.
     * @return YajraDataTablesDataTableAbstract
     */
    public function dataTable($query)
    {
        return datatables()
            ->eloquent($query)
            ->addIndexColumn()
     
                 ->addColumn('kordinat', function(Kabupaten $kabupaten) {
                return $kabupaten->koordinat_bujur.",".$kabupaten->koordinat_lintang;
                 })
                //  ->addColumn( 'action', function($data){ // $data is data od current row in table 
                //     return view( 'kabupaten.action', [ 'data' => $data ] );
                // } );
            ->addColumn('action', 'kabupaten.action');
    }

    /**
     * Get query source of dataTable.
     *
     * @param AppModelsKabupaten $model
     * @return IlluminateDatabaseEloquentBuilder
     */
    public function query(Kabupaten $model)
    {
        // return $model->newQuery()->with('provinsi');
        return  Kabupaten::with('provinsi')->select('kabupaten.*','provinsi.provinsi');
    }

    /**
     * Optional method if you want to use html builder.
     *
     * @return YajraDataTablesHtmlBuilder
     */
    public function html()
    {
        return $this->builder()
                    ->setTableId('kabupaten-table')
                    ->columns($this->getColumns())
                    ->minifiedAjax()
                    ->dom('Bfrtip')
                    ->orderBy(1)
                    ->parameters([
                        'buttons' => ['excel'],
                    ])
                    ->buttons(
                        Button::make('create'),
                        Button::make('export'),
                        Button::make('print'),
                        Button::make('reset'),
                        Button::make('reload')
                    );
    }

    /**
     * Get columns.
     *
     * @return array
     */
    protected function getColumns()
    {
        return [
         
            Column::make('DT_RowIndex')->title('No')->orderable(false)->searchable(false),
            Column::make('provinsi.provinsi'),
            Column::make('status'),
            Column::make('kabupaten')->title('Nama kabupaten'),
            Column::make('ketinggian'),
            Column::make('kordinat')
            ->exportable(false)
            ->printable(false),
            // Column::make('keterangan'),
            Column::computed('action')
            ->exportable(false)
            ->printable(false),
        ];
    }

    /**
     * Get filename for export.
     *
     * @return string
     */
    protected function filename()
    {
        return 'Kabupaten_' . date('YmdHis');
    }
}

this is my kabupaten datatable class

<form id="delete_form" method="POST"> 
    @csrf
 @method('DELETE')</form>
 <a type="button" href="{{route('adm.kabupaten.show', ['id' => $id])}}" class="btn btn-just-icon btn-round btn-sm btn-info" data-toggle="tooltip" data-placement="bottom" title="detail">
     <i class="fa fa-eye"></i>
 </a>
 <a href="{{route('adm.kabupaten.edit', ['id' => $id])}}" class="btn btn-just-icon btn-round btn-sm btn-primary" data-toggle="tooltip" data-placement="bottom" title="ubah">
     <i class="fa fa-edit"></i>
 </a>
 <a href="#" data-url="{{ route('adm.kabupaten.destroy', $id) }}" class="btn btn-just-icon btn-round btn-sm btn-danger" onclick="return deleteConfirm(this);">
     <i class="fa fa-trash"></i>
 </a>


<script>
 $(function() {
     $('[data-toggle="tooltip"]').tooltip();
 })
</script>

and this is my action column.

provinsi model

public function kabupaten()
    {
        return $this->hasMany(Kabupaten::class);
    }

and kabupaten model

public function provinsi()
    {
        return $this->belongsTo(Provinsi::class);
    }

my question are why $id in kabupaten.action return provinsi.id instead of kabupaten.id

and i have try

return  Kabupaten::with('provinsi')->select('kabupaten.*','provinsi.provinsi');

The $id return kabupaten.id but when I try to sort column, it said column provinsi.provinsi not found because the yajra not join my query.

If there anything wrong with my code.

Thanks

Answer

try changing eloquent ‘with’ to ‘join’ in query()

public function query(Kabupaten $model)
{   
    return Kabupaten::query()
        ->leftJoin('provinsi', 'provinsi.id', '=', 'kabupaten.provinsi_id')
        ->addSelect([
            'kabupaten.*',
            'provinsi.provinsi as provinsi_provinsi'
        ]);
}

and add column

Column::make('provinsi_provinsi')->name('provinsi_provinsi')->title('provinsi_provinsi'),