Rappasoft

Array Columns (beta)

Array columns provide an easy way to work with and display an array of data from a field.

1ArrayColumn::make('notes', 'name')
2    ->data(fn($value, $row) => ($row->notes))
3    ->outputFormat(fn($index, $value) => "<a href='".$value->id."'>".$value->name."</a>")
4    ->separator('<br />')
5    ->sortable(),

Empty Value

You may define the default/empty value using the "emptyValue" method

1ArrayColumn::make('notes', 'name')
2    ->emptyValue('Unknown'),

Wrapping the Output

As the ArrayColumn is designed to handle multiple related records, you can choose to wrap these for improved UX.

It is recommended that you utilise the built-in flexCol or flexRow approaches, which will also disable the separator

flexCol

This adds either:

  • Tailwind: 'flex flex-col'
  • Bootstrap: 'd-flex d-flex-col'

And merges any attributes specified in the sole parameter (as an array)

1ArrayColumn::make('notes', 'name')
2    ->data(fn($value, $row) => ($row->notes))
3    ->outputFormat(fn($index, $value) => "<a href='".$value->id."'>".$value->name."</a>")
4    ->flexCol(['class' => 'bg-red-500'])
5    ->sortable(),

flexRow

This adds either:

  • Tailwind: 'flex flex-row'
  • Bootstrap: 'd-flex d-flex-row'

And merges any attributes specified in the sole parameter (as an array)

1ArrayColumn::make('notes', 'name')
2    ->data(fn($value, $row) => ($row->notes))
3    ->outputFormat(fn($index, $value) => "<a href='".$value->id."'>".$value->name."</a>")
4    ->flexRow(['class' => 'bg-red-500'])
5    ->sortable(),

Manually

You can also specify a wrapperStart and wrapperEnd, for example, for an unordered list:

1ArrayColumn::make('notes', 'name')
2    ->data(fn($value, $row) => ($row->notes))
3    ->outputFormat(fn($index, $value) => "<li><a href='".$value->id."'>".$value->name."</a></li>")
4    ->wrapperStart("<ul class='bg-blue'>")
5    ->wrapperEnd("</ul>")
6    ->sortable(),

See Also

Please also see the following for other available methods: