Invoice Editor with Items

Filament 4
Also available in Filament 3 version

This project illustrates the use of Repeater fields combined with live/reactive methods to build an invoice form featuring parent-child record relationships and real-time subtotal and total calculations.

AIx7w1ecv0WYnWJ3AWoCGj8g6Z9Lcn-metaMTItaW52b2ljZS1lZGl0b3ItaXRlbXMucG5n-

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:

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 152 Premium Examples for $99