How to Generate an Invoice Number Automatically in Bubble.io [2024]
Learn how to easily generate automatic invoice numbers in your Bubble.io app without any coding required. Perfect for solopreneurs and startups diving into the world of no-code development.
Unlock auto-numbering magic: Create professional invoices with automatic invoice numbering in Bubble!
No-code invoicing made easy: Learn how to implement incremental invoice numbers without touching a line of code.
Master Bubble workflows: Discover the power of auto-incrementing numbers for your invoicing app.
Introduction to Invoicing App in Bubble
I've got the beginnings of an invoicing app built with no code in Bubble just here. And I'm going to add to it and show you how you can add in auto numbering so that each invoice has a number and that number is an incremental one based on the number of invoices. But before I do that if you're learning Bubble if you're learning no codes be building a startup, then click the link down in the description and head over to our website where you can find hundreds of Bubble tutorial videos and resources. Sorry for that.
Creating an Auto-Incrementing Invoice Number
So let's dive into this and the first thing I'm going to do is show where I think it makes the most sense to put this which is on the create invoice action. So we can say create invoice and I'm gonna now add in a field called invoice number. Now you need to decide here whether it is just going to be a number. But sometimes invoicing has a prefix to do with the company's name, but I'm just gonna say it's going to be a number. So I'm gonna put number in there. Number okay, and this is the main bit and you can apply this at other points.
Implementing the Auto-Numbering Logic
But I think it makes sense to do it when you create the invoice because in the invoicing software I've used in the past say like free agent or fresh books. It's you want to anchor the number to the invoice when you create it. You wouldn't want to have a series of invoices in drafts where they could be kind of overlapping of numbers. So we'll say do a search for invoice count plus one.
Displaying the Invoice Number on the Page
Now if I go on to my invoice page and you can check out how I've created all of this in our previous videos. But effectively the page is of type content invoice. So it's always going to be linked to with a single invoice from the database. So let's now add in I'll just do a bit of text fact. Let's have it in here I'll just add in number. Now I say current pages invoice number. That's good have a bit unpleasant formatting it's been two spaces why not.
Testing the Auto-Numbering Feature
Okay, so let's go and run this in preview refresh. So I'll say new invoice create invoice. Okay, so it's created the invoice now if I click through to here, we should hopefully see invoice number 5. Again, remember that I'm not doing a count on this page I did the count when I created the invoice so that this is now kind of fixed in stone that this invoice is number 5. Let me give you another demo just to prove that this is all working. Say new invoice to create so this should be 6. There go invoice 6.
Conclusion
So that's how you can add auto incrementing numbers to an invoicing app built with Bubble.
Can't find what you're looking for?
Search our 300+ Bubble tutorial videos. Start learning no code today!
3 ways we support solopreneurs
Our team is here to help, with a combined 30+ years working for internet startips.
Learn Bubble
Explore our library of 300+ Bubble and no code tutorial videos. Watched by over 800k no coders on YouTube.
Bubble Coaching
Troubleshoot your Bubble app and build new no code features with our in house Bubble expert.
Mastery
Ready to take your SaaS idea to the next level? Join our exclusive Mastery program for personalised content & mentoring.