Categories: Web Design

Membuat upload dan tampil gambar pada dreamweaver dan php dengan mudah

Jadiberkah.com | Kali ini akan membahas bagaimana cara membuat input gambar atau upload gambar pada database dan bagaimana cara menampilkan gambar yang sudah berhasil kita upload .pada topik yang yang kali ini dibahas terbilang penting karena hampir semua website mempunyai fitur input atau upload gambar baik oleh admin maupun pengunjung web agar bisa mengirim gambar maupun data secara langsung.

baik langsung aja kita simak ulasan dibawah ini:

  1. Jalankak xampp atau kalo memakai apachetriad langsung aja buka browser mozila atau google chrom
  2. Buatlah database dan folder yang nanti akan dijadikan tempat penyimpanan missal saya bikin nama database u553012066_alva dan nama folder upload
  3. Buatlah file didalam folder upload missal saya kasih contoh yaitu buatlah pada kolom pertama kolom idgambar (int) dan dijadikan primary key juga sekaligus auto_increment, kolom selanjutnya yaitu gambar typenya (Varchar 20) lalu keterangan.

 

  1. Buka dreamweaver
  2. Pilih file php baru.
  3. Lalu bikin file upload.php
  4. prosesupload.php
  5. dan tampilupload.php

Upload

Kali ini teman teman bikin file upload.php aja dulu caranya:

  • Klik insert

 

 

 

 

 

 

 

 

  • Data objects

 

 

 

 

  • Insert record
  • Record insertion wizard
  • Klik pada kolom gambar cari kode dibawah ini

<input type=”text” name=”gambar” value=”” size=”32″>

Rubah dan Ganti menjadi

<input type=”file” name=”gambar” value=”” size=”32″>

Maka kolom gambar akan berubah menjadi type “file”

  1. Tambahkian script berikut pada paling atas

<form method=”post” action=”prosesupload.php” enctype=”multipart/form-data”>

Dan diakhiri dengan </form> pada script paling bawah

prosesupload.php ganti sesuai dengan file proses penyimpanan  yang teman teman buat.

simak script kode dibawah ini

<form method=”post” action=”prosesupload.php” enctype=”multipart/form-data”>

<?php require_once(‘Connections/koneksi.php’); ?>

<?php

if (!function_exists(“GetSQLValueString”)) {

function GetSQLValueString($theValue, $theType, $theDefinedValue = “”, $theNotDefinedValue = “”)

{

if (PHP_VERSION < 6) {

$theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;

}

 

$theValue = function_exists(“mysql_real_escape_string”) ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);

 

switch ($theType) {

case “text”:

$theValue = ($theValue != “”) ? “‘” . $theValue . “‘” : “NULL”;

break;

case “long”:

case “int”:

$theValue = ($theValue != “”) ? intval($theValue) : “NULL”;

break;

case “double”:

$theValue = ($theValue != “”) ? doubleval($theValue) : “NULL”;

break;

case “date”:

$theValue = ($theValue != “”) ? “‘” . $theValue . “‘” : “NULL”;

break;

case “defined”:

$theValue = ($theValue != “”) ? $theDefinedValue : $theNotDefinedValue;

break;

}

return $theValue;

}

}

 

$editFormAction = $_SERVER[‘PHP_SELF’];

if (isset($_SERVER[‘QUERY_STRING’])) {

$editFormAction .= “?” . htmlentities($_SERVER[‘QUERY_STRING’]);

}

 

if ((isset($_POST[“MM_insert”])) && ($_POST[“MM_insert”] == “form1”)) {

$insertSQL = sprintf(“INSERT INTO upload (idgambar, gambar, keterangan) VALUES (%s, %s, %s)”,

GetSQLValueString($_POST[‘idgambar’], “int”),

GetSQLValueString($_POST[‘gambar’], “text”),

GetSQLValueString($_POST[‘keterangan’], “text”));

 

mysql_select_db($database_koneksi, $koneksi);

$Result1 = mysql_query($insertSQL, $koneksi) or die(mysql_error());

 

$insertGoTo = “upload.php”;

if (isset($_SERVER[‘QUERY_STRING’])) {

$insertGoTo .= (strpos($insertGoTo, ‘?’)) ? “&” : “?”;

$insertGoTo .= $_SERVER[‘QUERY_STRING’];

}

header(sprintf(“Location: %s”, $insertGoTo));

}

?>

 

<form method=”post” name=”form1″ action=”<?php echo $editFormAction; ?>”>

<p>Belajar proses upload gambar</p>

<table align=”center”>

<tr valign=”baseline”>

<td nowrap align=”right”>Gambar:</td>

<td><input type=”file” name=”gambar” value=”” size=”32″></td>

</tr>

<tr valign=”baseline”>

<td nowrap align=”right”>Keterangan:</td>

<td><input type=”text” name=”keterangan” value=”” size=”32″></td>

</tr>

<tr valign=”baseline”>

<td nowrap align=”right”>&nbsp;</td>

<td><input type=”submit” value=”UPLOAD”></td>

</tr>

</table>

<input type=”hidden” name=”MM_insert” value=”form1″>

</form>

<p>&nbsp;</p>

</form>

Selesa sudah membuat file upload selanjutnya kita akan membuat file prosesupload.php dimana file perintah penyimanan gambar akan di ekseskusi,yuk langsung aja.

Proses upload

Buka file prosessimpan.php yang sudah dibuat

Ketik atau copy kan script dibawah ini:

<?php

session_start();

require_once(‘Connections/koneksi.php’);

mysql_select_db(“u553012066_alva”,$koneksi);

?>

<script language=”javascript” type=”text/javascript”>

alert(‘Header berhasil disimpan.!’);

</script>

<meta http-equiv=”refresh” content=”0;url=inputheader.php”/>

<?

$lokasi_file=$_FILES[‘gambar’][‘tmp_name’];

$nama_file=$_FILES[‘gambar’][‘name’];

if

(!empty($lokasi_file)){

move_uploaded_file($lokasi_file,”gambar/$nama_file”);

mysql_query(“insert into header(gambar)values (‘$nama_file’)”);

}

?>

Gantilah script dibawah ini dengan nama database yang teman teman buat missal untuk contoh dibawah ini nama databasenya adalah “u553012066_alva”

 

<?php

session_start();

require_once(‘Connections/koneksi.php’);

mysql_select_db(“u553012066_alva”,$koneksi);

?>

Untuk pesan javascript dibawah ini biasa teman teman rubah sendiri dengan kata kata yang lain

 

<script language=”javascript” type=”text/javascript”>

alert(‘Header berhasil disimpan.!’);

</script>

<meta http-equiv=”refresh” content=”0;url=inputheader.php”/>

 

Dan untuk script di bawah ini rubahlah dengan folder gambar yang teman teman buat,missal pada tulisan gambar itu menunjukan nama folder gambar dan nama file gambar dan nama tabel pada data databse yang sudah kita buat tadi

<?

$lokasi_file=$_FILES[‘gambar’][‘tmp_name’];

$nama_file=$_FILES[‘gambar’][‘name’];

if

(!empty($lokasi_file)){

move_uploaded_file($lokasi_file,”gambar/$nama_file”);

mysql_query(“insert into upload(gambar,keterangan)values (‘$nama_file’,’$_POST[keterangan]’)”);

}

?>

Selanjutnya kita membuat tampil upload:

 

 

 

 

 

 

 

 

  • Klik insert pada menu bar lalu klik data objects lalu kita buat Recordset terlebih dahulu.

 

 

 

 

 

 

  • Beri nama recordest terserah teman teman
  • Lalu pilih koneksi
  • Pilih table yang mau di tampilkan missal saya pilih table upload
  • Pilih column all untuk menampilkan semua kolom atau selected untuk menampilkan yang dipilih saja

 

 

 

 

 

 

 

 

  • Lalu kita masuk tahap menampilkan gambar yaitu sama persis pada proses menampilkan data Cuma ada sedikit perubahan.
  • Klik insert lalu pilih data object
  • Pilih dynamic data lalu pilih dynamic table
  • Pilih recordet yang tadi kita buat
  • Show berapa kolom yang akan di tampilkan
  • Border cell padding dan cell spacing tinggal di sesuaikan berapa ukuranya.
  • Lalu pada kolom gambar di klik rubahlah scdript kode dibawah ini
  • <img src=”gambar/<?php echo $row_rstampilupload[‘gambar’]; ?>”>
  • Alias menambahkan kode img src=”gambar/
  • Lalu save lalu jalankan pada browser dengan menekan F12

 

Semoga berhasil dan bila ada yang kurang jelas dan kurang paham bisa ditanyakan di kolom komentar dibawah ini.

Share
Leave a Comment