Home > OS >  Laravel Tailwind CSS - Tooltip didn't get data, but parent div gets it
Laravel Tailwind CSS - Tooltip didn't get data, but parent div gets it

Time:03-29

I've got a table with attendance, where I just pass specific color to div and id of attendance, but I didn't understand one thing: The id passed like <div id={{ attendance->id }}></div> works, but when I pass other data just one line lower like I did before it gets the latest even if I empty that var after use?

@for ($i = 1; $i <= 30; $i   )
    @foreach ($user->attendances as $attendance)
        @php
            $temp = strtotime(Carbon\Carbon::parse(Carbon\Carbon::now())->startOfMonth()->setMonth(Carbon\Carbon::now()->month)->setDay($i)->format('Y-m-d'));  
            $start = strtotime(Carbon\Carbon::parse($attendance->start));
            $end = strtotime(Carbon\Carbon::parse($attendance->end));
        @endphp

        @if ($temp >= $start && $temp <= $end)
        @php
            $user->cell = $attendance->id;                                                 
            $user->style = $attendance->reasons->color;
        @endphp
        @endif
                                                                
    @endforeach

    <td >
                                                                
    <div data-tooltip-target="tooltip-default"  style="background-color: {{ $user->style }}" id="{{ $user->cell }}"> <!-- Here it gives right value to each div -->
        <div id="tooltip-default" role="tooltip" >
        ID attendance:{{ $user->cell }}<br> <!-- it gives the latest ID in DB. -->
        <div  data-popper-arrow></div>
        </div>
    </div>  
    </td>
    @php 
    $user->cell = ''; 
    $user->style = '';
    @endphp
@endfor

How to explain that? Is there better way to create tooltip to each div in table cell?

CodePudding user response:

Update:

Overriding stylizations can cause be a pain. However, in the OP situation injecting a hex rgb value was not able to be injected in the class attribute.

  • Related