Filament: Invoice Editor with Items

Use the Repeater field and live methods to create an invoice with parent/children records, calculating the subtotal/total with taxes in live mode.

12-invoice-editor-items

Get the Source Code:

How it works

The main logic lives in our InvoiceResource and is mainly contained within the form() method:

  • Using a Repeater field to allow adding multiple items
  • Using the live() method to calculate the subtotal and total in real time
  • Using a custom function to trigger calculations on items list change, quantity change
  • Disabling options in real-time to prevent duplicate items from being added

Here's how it looks in the code:

app/Filament/Resources/InvoiceResource.php

// ...
 
class InvoiceResource extends Resource
{
public static function form(Form $form): Form
{
$products = Product::get();
 
return $form
->schema([
Forms\Components\TextInput::make('customer_name')
->required()
->maxLength(255),
Forms\Components\TextInput::make('customer_email')
->email()
->required()
->maxLength(255),
Section::make()
->columns(1)
->schema([
// Repeatable field for invoice items
Forms\Components\Repeater::make('invoiceProducts')
 
// ...
The FULL tutorial is available after the purchase: in the Readme file of the official repository you would get invited to.
Get the Source Code: All 50 Premium Examples for $99 Only Form Examples for $39