June 2020

June 21, 2020 0

Ekstensi yang diperbolehkan .png | .jpg | .jpeg | .gif

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<html>
<head>
<title>www.malasngoding.com - Upload file menggunakan php mysqli</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h2 style="text-align: center;">Tambah Data Pegawai</h2>
<form action="user_act.php" method="post" enctype="multipart/form-data">
<div class="form-group">
<label>Nama :</label>
<input type="text" class="form-control" placeholder="Masukkan Nama" name="nama" required="required">
</div>
<div class="form-group">
<label>Kontak :</label>
<input type="number" class="form-control" placeholder="Masukkan Kontak" name="kontak" required="required">
</div>
<div class="form-group">
<label>Alamat :</label>
<textarea class="form-control" name="alamat" required="required"></textarea>
</div>
<div class="form-group">
<label>Foto :</label>
<input type="file" name="foto" required="required">
<p style="color: red">Ekstensi yang diperbolehkan .png | .jpg | .jpeg | .gif</p>
</div>
<input type="submit" name="" value="Simpan" class="btn btn-primary">
</form>
</div>
 
</body>
</html>

Dalam membuat form ini saya menggunakan librabry bostrap 4 supaya tampilan sedikit lebih bagus hehe. Pada baris ke 12, tapetnya pada

saya menggunakan file dengan nama user_act.php dengan method post dalam mengirim data. Ekstensi gambar yang diperbolehkan yaitu png, jpg, jpeg, dan gif, bisa sobat lihat pada baris ke 28.

Potongan dari perintah pada baris ke 12 ini bisa dilihat ada satu fungsi enctype adalah atribut yang berperan dalam menentukan bagaimana data form dikirim ke server dan tipe form terseut.

Membuat Aksi Inputan File

Langkah ke 4 kita akan membuat sebuah file aksi untuk memproses inputan gambar, disini saya kasi nama user_act.php . File ini nantinya berisikan perintah untuk memproses data yang kita input dari form masuk kedatabase. Untuk perintahnya silahkan dilihat di code berikut :

Dari potongan kode diatas merupakan file aksi dari form yang sebelumnya kita buat. Pertama-tama kita harus menginclude dahulu file koneksi.php yang menghubungkan database dengan sistem yang dibuat menggunakan PHP. Sedangkan baris ke 3 sampai 5 itu berfungsi untuk menangkap data yang dikirim menggunakan method post dari form sebelumnya.

Perhatikan kode diatas, fungsi rand() disini untuk merandom nomor. Fungsinya disini untuk memberikan nomor random untuk nama file gambar supaya ketika ada gambar dengan nama bisa dibedakan dari angka random ketika diinput nantianya. Misalnya profil_saya.png ketika 001298_profil_saya.png.

Sedangkan variabel $ekstensi disini saya menyimpan ekstensi yang diperbolehkan ketika mengupload file. Seperti yang sudah saya bilang sebelumnyaa kita memerlukan ekstensi yang diperbolehkan ketika upload file.

$filename adalah variabel yang menyimpan nama file yang sudah di input sebelumnya.  Sedangkan $ext adalah variabel yang disini kita akan mengecek ekstensi yang yang di upload.

Di baris ke 13, seperti code diatas yaitu kita cek dahulu ekstensi yang diperbolehkan dan ekstensi file yang kita upload. Untuk mengeceknya disini kita menggunakan fungsi in_array, !in_array disini maksudnya jika nilai ekstensi yang diperbolehkan dan ekstensi gambar tidak sama maka akan dialihkan ke halaman index.php dengan peringatan gagal ekstensi.

Sedangkan jika ekstensi file yang diinput termasuk kedalam dalam ekstensi yang diperbolehkan maka akan disimpan di dalam database. $xx = $rand.’_’.$filename adalah variabel yang menyimpan nama file yang disimpan dan disisipkan angka random sebelum nama file.

move_uploaded_file adalah fungsi php untuk upload file, disini kita akan mengupload file foto kedalam folder gambar diikuti dengan nama file yang sudah dirandom.

Untuk tampilan form upload dapat dilihat pada gambar berikut :

Upload File Menggunakan PHP dan MySQLi

Tampilan form upload

Menampilkan Hasil Inputan

Oke yang terakhir kita akan menampilkan hasil dari form yang kita inputkan sebelumnya. Disini nama filenya index.php untuk codenya bisa dilihat seperti berikut :

 
Subscribe to: Posts (Atom)
 
Top