shahr's avatar
Level 10

Uncaught TypeError: TOOLTIP: Option "content" provided type "null" but expected type "(string|element|function)".

I am using bootstrap 5,

What is this error?

err

 <button type="button" class="btn btn-sm btn-secondary" data-bs-toggle="popover" title="des" data-bs-content="{{ $order->report->description }}" data-bs-placement="bottom">press me</button>

<script>
    var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'))
    var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
        return new bootstrap.Popover(popoverTriggerEl)
    });
</script>
0 likes
5 replies
Mareco's avatar

Hi,

in your controller function, please do:

dd($order->report->description);

What do you get?

I think your report doesn't exist for your order.

Mareco's avatar
Mareco
Best Answer
Level 4

@webinar So there is a problem, I think. You can't put into bootstrap 5 "data-bs-content" attribute null. Error tells you attribute needs string, element or function.

Try to do this:

dd($order->report);

If its null too, it means your report does not exist for your order and u need to do something like this

<button type="button" class="btn btn-sm btn-secondary" data-bs-toggle="popover" title="des" data-bs-content="{{ $order->report?->description }}" data-bs-placement="bottom">press me</button>

And if report exists and only description is null, try this:

<button type="button" class="btn btn-sm btn-secondary" data-bs-toggle="popover" title="des" data-bs-content="{{ $order->report->description ?? '' }}" data-bs-placement="bottom">press me</button>
1 like
enscglms's avatar

@Mareco

Wow! Does such a syntax really exist?

{{ $order->report?->description }}

I always used it this way.

{{ $order->report ? $order->report->description : '' }}
1 like

Please or to participate in this conversation.