Input File ke Laravel - Dunia Laravel

Isi dari website pasti bukan cuma teks, kalo isinya teks doang pasti bosen kan. Dan kalo kita ngebuat website dinamis artinya gambar nya juga harus bisa diinputin sama user. Karena akan aneh kalo isi websitenya dinamis tapi gambarnya tetap statis. Di laravel input file ga terlalu ribet kok.

 

Table of Contents

• Things That Need to be Prepared
• Make Views
• Materi Controller 

 

Things That Need to be Prepared

Database dan sebuah project laravel tentunya. Sekarang aku pake project yang seblumnya aku buat di artikel CRUD. Tapi ga jauh beda kalo kalian buat dari awal.

Pertama kalian setting database sama table kalian dulu. Struktur table bisa disesuaikan seperti keinginan kalian. Disini struktur table yang aku pake kaya gini.

        Schema::create('materi', function (Blueprint $table) {

            $table->id();

            $table->string('judul');

            $table->string('pengarang');

            $table->string('tipe');

            $table->timestamps();

            $table->string('deskripsi');

            $table->date('tgl_publish');

            $table->unsignedBigInteger('user_id');

            $table->string('file')->nullable();

        });

 

Kolom yang terpenting adalah kolom ‘file’ pada akhir table. Kolom itu yang nanti ktia gunakan untuk menyimpan nama file yang kita mau.

Kemudian kita perlu buat Model dan Controller.

php artisan make:controller MateriController --resource

php artisan make:model Materi

 

Untuk isi modelnya kita akan cuma deklarasi table nya aja. Jadi isi dari model seperti ini

class Materi extends Model

{

    protected $table='materi';

}

 

Jangan lupa definisikan route untuk akses controller MateriController di routes/web.php. Kalian bisa gunakan Route::resource('/materi','MateriController'); biar simple.

 

Make Views

Seperti yang kalian tahu, struktur normal view punya laravel itu ada di folder resource/ views. Tapi disini aku buat folder baru lagi didalam folder views dengan nama materi. Jadi struktur yang view yang sekarang itu ada di resource/ views/ materi. Kenapa dibuat gini? Sebenernya dibuat gini cuma buat ngelompokin aja. Bedanya cuma pas mau manggil view nya, kita harus panggil nama foldernya juga.

Disini ada 2 views yang mau dibuat. Yang pertama adalah index.blade.php yang digunakan untuk menampilkan data materi secara keseluruhan. Dan yang kedua adalah create.blade.php yang digunakan sebagai form upload. Di form inilah nanti kita mulai buat fungsi upload file nya. Oh ya, sebelumnya data di databaseku udah ada isinya, soalnya aku pake database bekas artikel sebelumnya yang tentang seeder dan factory.

Untuk file index.blade.php.

 

Digunakan untuk menampilkan data dari materi. Kemudian untuk create.blade.php.

 

Seperti yang bisa kalian lihat, disana terdapat form dengan beberapa input. Inti dari artikel ini ada pada input terakhir, yaitu tag input dengan type ‘file’. Dan jangan lupa untuk menambahkan enctype="multipart/form-data" didalam tag form agar form dapat memproses file.

 

MateriController

Sebelumnya kita udah buat controller dengan menggunakan --resource yang artinya kita akan mendapatkan template function CRUD berupa index(), create(), store(),show(), edit(), update(), destroy(). Tapi sekarang kita cuma pake 3 yaitu index(), create(), store().

Pada function index() kita akan menampilkan views index.blade.php dengan data dari table Materi.

        $materis = Materi::all();

        return view('materi.index',['materis' => $materis]);

Kalo table kalian udah ada isinya, nanti hasilnya bakal kaya gambar diatas. Tapi kalo table kalian kosong, ga akan ketampil apapun.

Selanjutnya kita ke function create() tempat dimana kita akan menampilkan form. Seperti yang udah aku bilang, disini aku pake data dari artikel sebelumnya, yaitu artikel seeder dan factory. Dari artikel tersebut, aku udah punya beberapa data yang ada di table Materi dan Users. Dan lagi, aku udah punya foreign key yang udah aku deklarasiin di table materi yaitu pada kolom ‘user_id’. Jadi pada saat kita akan menampilkan form inputnya, aku juga akan mengambil data user buat aku masukin di dropdown ‘pengarang’.

        //Mengambil data user

        $users = User::all();

        return view('materi.create',['users' => $users]);

Tampilannya akan jadi seperti gambar diatas.

Selanjutnya adalah function store(). Dalam function ini kita akan buat validator untuk inputnya kemudian baru ke pengolahan filenya.

        //jalankan validator

        $validator = Validator::make($request->all(), [

            'judul' => 'required|max:255',

            'pengarang' => 'required',

            'tipe' => 'required',

            'deskripsi' => 'required',

            'file' => 'required',

        ]);

 

        if ($validator->fails()) {

            return redirect()

                        ->back()

                        ->withErrors($validator)

                        ->withInput();

        }

 

        //mendapatkan data file

        $foto = $request->file('file');

        //mengubah format nama file

        $foto_name = Str::random(10).'.'.$foto->getClientOriginalExtension();

        //tempat menyimpan file

        $path = 'images';

        //perintah untuk menyimpan file

        $foto->move($path,$foto_name);

 

        //menggunakan id user untuk mendapatkan nama pengarang

        $user = User::find($request->pengarang);

 

        //save data

        $new_data = new Materi;

        $new_data->judul = $request->judul;

        $new_data->pengarang = $user->name;

        $new_data->tipe = $request->tipe;

        $new_data->deskripsi = $request->deskripsi;

        $new_data->tgl_publish = now();

        $new_data->user_id = $request->pengarang;

        $new_data->file = $foto_name;

        $new_data->save();

 

        return redirect(route('materi.index'));

 

Sebenernya validator-nya ga berpengaruh banget. Fokus kita ada setelah validator nya selesai. Logika dari input file ini adalah dimulai dari mendapatkan file menggunakan  $request->file('name_of_input'). Kemudian mengubah nama filenya menjadi 10 karakter random ditambahkan dengan ekstensi filenya menggunakan Str::random(10).'.'.$foto->getClientOriginalExtension(). Kenapa namanya dibuah? biar memperkecil nama yang sama. Kemudian file akan di pindahkan ke direktori laravel menggunkaan $foto->move($path,$foto_name). Kemana filenya dipindahkan? Ke direktori yang udah kita deklarasi di $path = 'images'. Path itu akan menuju ke direktori public/images/.

Selanjutnya adalah menyimpan data berupa nama file kedalam database agar bisa dipanggil.