Laravel-datatables: $this->builder()->getTableAttribute('id') returns default value

[azorpax]

Summary of problem or feature request

$this->builder()->getTableAttribute('id') is returning default value.

Code snippet of problem

public function html()
{
    return $this->builder()
        ->ajax([
            'url' => '.......',
            'data' => 'function (d) { ' .      
                'd.display_today = ($("' . $this->builder()->getTableAttribute('id') . '").parent().parent().find("#display_today").is(":checked")) ? 1 : 0; ' .
                '}'
        ]);
}

                {!! $dataTable->table(['id' => 'tubol', 'width' => '100%']) !!}
                @push('scripts')
                    {!! $dataTable->scripts() !!}
                @endpush

System details

• Laravel Version
  laravel 5.3
• Laravel-Datatables Version
  "yajra/laravel-datatables-oracle": "~6.0",

[yajra]

This is due to timing on how the id was set. Try setting the id first via builder class.

public function html()
{
    return $this->builder()
        ->setTableAttribute('id', 'tubol')
        ->ajax([
            'url' => '.......',
            'data' => 'function (d) { ' .      
                'd.display_today = ($("' . $this->builder()->getTableAttribute('id') . '").parent().parent().find("#display_today").is(":checked")) ? 1 : 0; ' .
                '}'
        ]);
}

{!! $dataTable->table(['width' => '100%']) !!}
@push('scripts')
    {!! $dataTable->scripts() !!}
@endpush

[azorpax]

i have two tables in one page both of them access the same controller. if i do that, i need to create new controller.

<div class="nav-tabs-custom">
            <ul class="nav nav-tabs">
                <li class="active"><a href="#tab_1" data-toggle="tab">Tab1</a></li>
                <li><a href="#tab_2" data-toggle="tab">Tab2</a></li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane active" id="tab_1">
<input type="checkbox" id="display_today"/>
                {!! $dataTable->table(['id' => 'table1', 'width' => '100%']) !!}
                @push('scripts')
                    {!! $dataTable->scripts() !!}
                @endpush
</div>
                <div class="tab-pane active" id="tab_2">
<input type="checkbox" id="display_today"/>
                {!! $dataTable->table(['id' => 'table2', 'width' => '100%']) !!}
                @push('scripts')
                    {!! $dataTable->scripts() !!}
                @endpush
</div>
</div>

[yajra]

I see, then you need to dynamically identify the id of the current table using javascript.

[yajra]

Since you are using tabs, I think this api can be of use:

https://datatables.net/reference/api/%24.fn.dataTable.tables()

[azorpax]

yes. but i am having trouble how to do it. its been hours now I cant find a way. :(
here is a jsfiddle: http://jsfiddle.net/0vuxogqh/
i hope you can help me

[yajra]

Try this:

To get the current visible table id:

$.fn.dataTable.tables(true)[0].id

Append in the builder.

public function html()
{
    return $this->builder()
        ->setTableAttribute('id', 'tubol')
        ->ajax([
            'url' => '.......',
            'data' => 'function (d) { ' .      
                'd.display_today = ($("#" + $.fn.dataTable.tables(true)[0].id).parent().parent().find("#display_today").is(":checked")) ? 1 : 0; ' .
                '}'
        ]);
}

[azorpax]

it only gets the values from the visible table.
lets say in table1/tab1 will have "status_ = 0"
and table2/tab2 "status_ = 1".
the value of status_ will be used in filtering.

<div class="nav-tabs-custom">
            <ul class="nav nav-tabs">
                <li class="active"><a href="#tab_1" data-toggle="tab">Tab1</a></li>
                <li><a href="#tab_2" data-toggle="tab">Tab2</a></li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane active" id="tab_1">
<input type="checkbox" id="display_today"/>
<input type="hidden" value="0" id="status_" />
                {!! $dataTable->table(['id' => 'table1', 'width' => '100%']) !!}
                @push('scripts')
                    {!! $dataTable->scripts() !!}
                @endpush
</div>
                <div class="tab-pane active" id="tab_2">
<input type="checkbox" id="display_today"/>
<input type="hidden" value="1"  id="status_" />
                {!! $dataTable->table(['id' => 'table2', 'width' => '100%']) !!}
                @push('scripts')
                    {!! $dataTable->scripts() !!}
                @endpush
</div>
</div>

i am thinking something like this. but the "$(this)" is not working.

public function html()
{
    return $this->builder()
        ->ajax([
            'url' => '.......',
            'data' => 'function (d) { ' .      
                'd.display_today = ($(this).parent().parent().find("#display_today").is(":checked")) ? 1 : 0; ' .
                'd.status_ = ($(this).parent().parent().find("#status_").val(); '.
                '}'
        ]);
}

[azorpax]

maraming salamat sa tulong.