Return to homepage

Build a Livewire CSV Importer

24/25. Updating the import progress UI
This episode is for premium members only.

Take your skills to the next level with a premium membership.

Join now

Already a member? Sign in and enjoy.

Comments

Jamie

This is a great tutorial and has helped me a lot. I am trying to work out how to append each row of the imported data to include extra information like the current user's ID and source: import. Any ideas?

  • 0
Rudi

Where I can find the design or final source code?

  • 0
Ryan

This could really use an episode or 2 about validating each record before upserting it into the database. It wasn't complicated to add but someone may not be aware of how to do it. Also in episode 18, you didn't need to pass the model in on its own, you could just get that off the import model itself.

  • 0
Humayun

how can we emit event in bacth final callback?

` $component = $this; Bus::batch($batches) ->finally(function () use ($billProcess , $component) {

1     $billProcess->completed_at = Carbon::now();
2     $billProcess->save();
3
4     $component->emit('billGenerationFinished');
5 })
6->dispatch();`
  • 0
Humayun

$import->touch('completed_at'); is not updating column? what could be the reason?

  • 0
Thomas

Hello!

Thanks for the nice course, it's a great wat to get started concretely with Livewire. However I encountered an issue at step 18. When uploading a csv, the final SQL query executed actually takes the headers of the CSV as fields to upsert.

In app/Jobs/ImportCsv.php I log the value for $chunk and get this (the array keys are actually my CSV headers):

 1[2022-10-25 07:05:54] local.INFO: chunkarray (
 2  0 =>
 3  array (
 4    'prénom' => 'Thomas',
 5    'nom' => 'Test',
 6    'email' => '',
 7    'mobile' => '33611223344',
 8    'profession' => 'Testeur',
 9    'site web' => 'https://monsite.fr',
10  ),
11  1 =>
12  array (
13    'prénom' => 'Suzanne',
14    'nom' => 'Pichard',
15    'email' => 'suzanne@gmail.com',
16    'mobile' => '',
17    'profession' => '',
18    'site web' => '',
19  ),
20  2 =>
21  array (
22    'prénom' => 'Frédéric',
23    'nom' => 'Mafataitz',
24    'email' => '',
25    'mobile' => '',
26    'profession' => 'Testeur',
27    'site web' => '',
28  ),
29)

The resulting SQL query logically fails:

1[2022-10-25 07:05:56] local.ERROR: SQLSTATE[42703]: Undefined column: 7 ERROR:  column "nom" of relation "prospect" does not exist
2LINE 1: ...into "prospect" ("created_at", "email", "mobile", "nom", "pr...

Any idea what might be causing this? I thought the main idea of mapping the columns of your CSV to the fixed grid of data was to allow for this.

Thanks!

  • 0
Thomas

Please note that I have also tried and copy / paste the original source code for this course and it does the same.

  • 0
Thomas

I think now I understand that the tutorial works when your headers in the CSV fit the column names in the DB. Unfortunately that is now always the case, and having the ability to map DB column with file columns is important to me.

So I hacked the import() method with this:

 1$batches = collect(
 2    (new ChunkIterator($this->csvRecords->getRecords(), 10))
 3        ->get()
 4)->map(function ($chunk) use ($import) {
 5    $data = [];
 6    foreach ($chunk as $newProspect) {
 7        $newEntry = [];
 8        foreach ($newProspect as $field => $value) {
 9            $key = array_search($field, $this->columnsToMap);
10            if ($key) {
11                $newEntry[$key] = trim($value);
12            }
13        }
14 
15        $data[] = $newEntry;
16    }
17 
18    return new ImportCsv($import, $this->model, $data, $this->columnsToMap);
19})
20->toArray();

Seems to be doing the trick even if it's very rough...

  • 0
Daichi

HI.

I just notice when you upload csv file that doesn't have id, first_name, last_name, email field, this app is not going to import anything at all. (Just create a csv files with id, first, last, email header for testing and see it for yourself)

Further more, even if you use identical csv file on this course then you just choose first_name for every fields (id, first_name, last_name, email columns) to be imported into, it still ignores everything (it reads id to id, first_name to first_name and so on) and just finish importing without causing any errors. This is strange, you specified them all get imported just from first_name column. Expected result should be that every columns filled with first_name data (or perhaps id column throws an error because of different data types).

There must be some mistakes here?

  • 0
usama

How can we upload larger files? let's say more than 4GB? with livewire, since it stores the temp file locally first. Any idea?

  • 0
Farooq

I have a proplem with Horizon on windows,, is there any way to make run on window 11 or 10?

  • 0
arjan

Hi, im getting a ''No property found for validation: [ColumnsToMap.id]'' hope you can help me out.

public function rules() { $columnRules = collect($this->requiredColumns) ->mapWithKeys(function ($column) { return ['ColumnsToMap.' . $column => ['required']]; }) ->toArray();

1    return array_merge($columnRules, [
2
3        'file' => ['required', 'file', 'mimes:csv', 'max:51200'],
4
5    ]);
6}
  • 0
krekas

Is ColumnsToMap really in capital?

  • 0
arjan

Thanks! 🤣

  • 0
Jesper

Instead of turning columnsToMap into a collection, mapping and using toArray, you could just use: array_fill_keys($this->columnsToMap, ‘’);

  • 1
Eugene

Can we use another file extension (xlsx,xls,ods) to import with LeagueCSV? I investigated and seems to me we can't ((. Maybe it possible to add this functionality by adding adapterю If we have other mime type (not CSV) then use another lib or smth like that)?

  • 0
Eugene

I have an issue: in CsvImporter.php in rules() method I try to define rule for file: 'file' => ['required', 'mimes:csv,xlsx,xls,ods', 'max:51200'] (the same as in cource), but this rule accept all mime type except csv ))). Anyone has an idea? P.S.: I use Ubuntu 20.04, Laravel 7 and php 7.4.

  • 0
Eugene

I find the answer: just add txt to mime types ---> 'mimes:csv,txt,xlsx,xls,ods',

  • 0
ossama

Quick Tip:

If you want to make an invokable controller, you may pass i flag into the artisan command.

An example:

1php artisan make:controller CustomerIndexController -i

or

1php artisan make:controller CustomerIndexController --invoke
  • 2
Ozan

Will there be a source download available?

  • 1
krekas

Usually source download is available after course is fully uploaded

  • 0
Manuel

Any ideas about how to auto detect the CSV format?

My CSV is splitted with ";" so I had to set in readCsv method

$csv->setDelimiter(';');

  • 0
Emil

You can use the static Info-class that are in the League package

1$delimiters = Info::getDelimiterStats($csv, [',', ';'], 2);
2if ($delimiters[';'] > 0)
3    $csv->setDelimiter(';');

If I find any ; as delimiters, I set that as the default.

  • 0
Lloric

thanks for this course, by the way have no knowledge of javascript so that is why i'm choosing livewire to easy manage by using php laravel backend.

  • 0
Farooq

thanks for your work,,, i tried the code but the non-CSV file still uploaded event the validation shown an error. and i have question/requiest i am trying to make master/detail form with livewire ( like invoice with multiple lines of products ) with livewire is there any project avaible you recommend? thanks

  • 0