Build a Livewire CSV Importer
This episode is for members only

Sign up to access "Build a Livewire CSV Importer" right now.

Get started
Already a member? Sign in to continue
Playing
10. Setting required import columns

Episodes

0%
Your progress
  • Total: 2h 20m
  • Played: 0m
  • Remaining: 2h 20m
Join or sign in to track your progress

Transcript

00:00
Now that we have our column mapping set up and this is working nicely, it's really important that we validate these based on what is required.
00:09
So you might have columns in here that you don't need to import, in which case we need to show an error. So they might just be optional columns that the user can import, but they're not necessarily required. They might be nullable in the database, which we have a couple of.
00:24
So let's go ahead and get started on this. We'll again start the base index here because we're going to be passing through to here what the required columns actually are. So let's go and say required columns and you could extend on this and make this really
00:40
really advanced if you wanted to, but to be honest just for an importer this kind of makes sense. So we're going to say id, first name, last name and email. Of course we could add another column in here because all of these will now show as required, but that's
00:56
absolutely fine. So we've got these required columns, again hopping over to the csv importer, we want to go ahead and add in an array in here of them required columns which will by default just be an empty array. And now what we need to do
01:10
is figure out when we press the import button at the bottom here, how do we then validate them? Because we're passing them in as this array, what we're actually going to need to do, and I mentioned this earlier,
01:22
is dynamically build up the required validation rule for these. So we're going to have to go ahead and map through these, build the rule up and then merge in the file rule as well. That's why we did this validate only file
01:38
when we upload the file, because when we validate everything we don't want to also validate each of the columns inside of here. So we're going to play around with this inside of here, but before we do that we need to have some sort of hook inside of our csv importer. So when we
01:53
actually click import, so let's have a look at the import button, when we actually click on this it actually does something. So that's going to be in the form itself, so we can say wire, submit, prevent, and we could just call an import method and we can
02:08
trigger the validation from there. So let's do this maybe just down here underneath updated file. So create that import method and we'll just die dump on import here for now. We also have this disabled property on the button, which I'm going to get rid of
02:25
temporarily. We are going to be disabling that until we have mapped all of our columns. So let's go ahead and hit import, let's hit import here and there we go. We get that died and done, so we can validate at that point.
02:38
So let's figure out the rules first of all. So if we head over to our csv importer and here we just say this validate, that's going to go ahead and call our rules. So we can still die dump in there, that's fine. And if we head up to our rules we're now
02:54
going to die dump out the mapped validation rules for each of the things that we've passed in. So let's create out a variable to represent this, we'll just call this column rules. We're going to collect up again because we're just dealing with a plain array,
03:08
the required columns, and once again we're going to map over these with keys so we can create out an array with a columns to map dot and then the name of the column and have this required. So essentially what we want to build up here, if we just return back down to this
03:24
array, we want to say columns to map dot id for example to be, if we just add required in there, we also want first name if it's required, if we've specified it within that property that we're passing in
03:40
and so on and so forth. So we want these to look like this but of course do this dynamically. So we're going to go ahead and let's just create out an actual closure here to make this a little bit more easy to read. That's going to have a column inside of here
03:54
and we're going to return columns to map dot the column name and then assign to that an array with the required ruling. So that's just going to give us exactly what we just saw inside of here. Let's die dump on this just so we know that this is looking good, so column
04:12
rules and let's go ahead and give this a go. So if we hit import, click upload a file, head over and choose the customers file, there we go. We have got the id which is required, the first name, the last name because obviously we've specified all of these. If we didn't we would
04:27
have less in there. So now what we want to do is merge this in with here. That's pretty simple with php, we just need to use the array merge function and we can merge in the column rules and then this array here with the file rules in. Now what we can do
04:44
is go over to our csv importer and where we added in our validation error here we can actually add this in now. So let's say error and this is dynamic again because remember we're iterating through this so each of the validation rules
04:58
needs to map up to what we're iterating through. We're going to say columns to map dot append on that column and go ahead and of course end that error there and then in here we just want to output the message. Now it's not going to look great at the moment but we're going to
05:15
be tidying this up in the next episode with some custom names for the columns that we want to import. So let's try this out. So to actually test this, in fact we don't need to really do anything because all of these are
05:29
required. So what we should now find is if we open up our customer csv and we have all of these in here and hit import, we get an error for each one. If we change this to id and hit import the message goes because of
05:42
course we've chosen it and the user would then have to just go through and fill in each of these until they've done all of them and only then would the rest of our import method run after we had called that validate method.
25 episodes•2 hrs 20 mins

Overview

Let's build a powerful CSV importer with Livewire, completely from scratch. This can handle millions of rows, be reused for multiple models, and by using job batches, doesn't require the browser to be open.

This course is for you if:

  • You need a robust importer component for your models that you have full control over
  • You want to brush up on some advanced Livewire concepts
  • You want to learn about job batching and queues in Laravel
Alex Garrett-Smith
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!

Episode discussion

No comments, yet. Be the first!