[BUG] Datatable UI Repeating in the blade template

[nramakrishna2022]

Describe the bug

Datatable UI Repeating in the blade template

Steps To Reproduce

Added below sample/example code in blade template from documentation

{{-- Setup data for datatables --}}
@php
$heads = [
    'ID',
    'Name',
    ['label' => 'Phone', 'width' => 40],
    ['label' => 'Actions', 'no-export' => true, 'width' => 5],
];

$btnEdit = '<button class="btn btn-xs btn-default text-primary mx-1 shadow" title="Edit">
                <i class="fa fa-lg fa-fw fa-pen"></i>
            </button>';
$btnDelete = '<button class="btn btn-xs btn-default text-danger mx-1 shadow" title="Delete">
                  <i class="fa fa-lg fa-fw fa-trash"></i>
              </button>';
$btnDetails = '<button class="btn btn-xs btn-default text-teal mx-1 shadow" title="Details">
                   <i class="fa fa-lg fa-fw fa-eye"></i>
               </button>';

$config = [
    'data' => [
        [22, 'John Bender', '+02 (123) 123456789', '<nobr>'.$btnEdit.$btnDelete.$btnDetails.'</nobr>'],
        [19, 'Sophia Clemens', '+99 (987) 987654321', '<nobr>'.$btnEdit.$btnDelete.$btnDetails.'</nobr>'],
        [3, 'Peter Sousa', '+69 (555) 12367345243', '<nobr>'.$btnEdit.$btnDelete.$btnDetails.'</nobr>'],
    ],
    'order' => [[1, 'asc']],
    'columns' => [null, null, null, ['orderable' => false]],
];
@endphp

{{-- Compressed with style options / fill data using the plugin config --}}
<x-adminlte-datatable id="table2" :heads="$heads" head-theme="dark" :config="$config"
    striped hoverable bordered compressed/>

Expected behavior

A clear and concise description of what you expected to happen.

Screenshots

Environment

Complete the next environment information.

Item	Version
Laravel	8.86
Project	Sample Project
OS	Windows

Additional context

Add any other context about the problem here. If you already have ideas to solve the issue, add them here or create a Pull Request (PR).

[nramakrishna2022]

Also Data Table UI is not same as original template. Breadcrumbs how to populate in this template?

[dirgareborn]

to add breadcrumbs, add @section('content_header') before @section('content')

@section('content_header')
<div class="row mb-2">
  <div class="col-sm-6">
    <h1>Users</h1>
  </div>
  <div class="col-sm-6">
    <ol class="breadcrumb float-sm-right">
      <li class="breadcrumb-item"><a href="#">Dashboard</a></li>
      <li class="breadcrumb-item active">Users</li>
    </ol>
  </div>
</div>
@stop
@section('content')
 Your content goes here
@stop

[dfsmania]

@smilymunna92 Please, you can get the same UI style if you do not use striped or any other attribute on the component, except bordered. On the other hand, I can't reproduce your first issue. Probably, you are doing something wrong. Please, share the blade markup you are using to define the component.

[dfsmania]

Closed, no feedback...