Home Coding Web Web Aplikasi Data Mahasiswa dengan PHP MySQL

Aplikasi Data Mahasiswa dengan PHP MySQL

By
7/18/2017
Read
Add Comment



Kali ini saya akan membuat aplikasi data mahasiswa dengan php. Disini saya menggunakan Xampp sebagai server lokal. Aplikasi ini terdiri dari entry data, lihat data, edit data dan delete.

Pertama Buat database di phpmyadmin

Masuk ke halaman phpmyadmin dengan url localhost/phpmyadmin


Kedua Buat file-file php

Buat folder baru di C:\Xampp\htdocs untuk meletakkan file-file php

File : koneksi.php

<?php
mysql_connect("localhost","root","");
mysql_select_db("mhs");
?>

File : index.php

<html>
<head>
<title> Home</title>
<link rel="shortcut icon" href="icon.ico" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<a class="button_example" href="tampil.php" title="Database Mahasiswa" onclick="alert('Anda masuk ke dalam database mahasiswa')">DATABASE MAHASISWA</a>
<a class="button_example2" href="tambah.php" title="Input Data" onclick="alert('Silahkan input data baru')">INPUT DATA</a>
</body>
</html>

File : tampil.php

<html>
<head>   
 <title>Database Mahasiswa</title>
 <link rel="shortcut icon" href="icon.ico" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>  
<body>
<h1>
Data Mahasiswa</h1>
<table width='648' cellpadding='5' align='center'>
<tr class='head'>
<th width='44' >No</td>
<th width='44' >NIM</td>
<th width='250' >Nama</td>
<th width='50'>Kelas</td>
<th width='152'>Jurusan</td>
<th width='120'>Aksi</td>
</tr>
<?php
include ("koneksi.php");
$no = 1;
 $query="SELECT * FROM `mahasiswa` ";
 $result= mysql_query($query) or die ('Error');
 while($record= mysql_fetch_array($result))
          {
  $nim=$record['nim'];
  $nama=$record['nama'];
  $kelas=$record['kelas'];
  $jurusan=$record['jurusan'];
 
 
echo"
<tr class='satu'>
<td align='center'>$no</td>
<td>$nim</td>
<td>$nama</td>
<td align='center'>$kelas</td>
<td align='center'>$jurusan</td>
<td align='center'><a href='edit.php?nim=$nim'><img src='edit.png' title='Edit'></a> | <a href='hapus.php?nim=$nim'><img src='delete.png' title='Hapus'></</a></td>
</tr>
";
$no++;
}
?>
</table>
<a class="img" href="index.php" title="kembali"><img src="kembali.png"></a>
</body>
</html>

File : tambah.php

<html>
<head>
<title>Input Data</title>
<link rel="shortcut icon" href="icon.ico" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body onLoad="document.forms.form.nim.focus()">
<div id="form" class="form1">
<form id="form" name="form" method="post" action="proses_tambah.php">
<h1>
Form Input</h1>
<label>NIM</label>
   <input type="text"  name="nim" id="nim" class ="highlight" maxlength="10" placeholder="NIM" required>

  <label>Nama</label>
   <input type="text"  name="nama" id="nama" class ="highlight" maxlength="25" placeholder="Nama" required>

  <label>Kelas</label>
   <input type="text"  name="kelas" id="kelas" class ="highlight" maxlength="1"  placeholder="Kelas" required>

  <label>Jurusan</label>
   <input type="text"  name="jurusan" id="jurusan" class ="highlight" maxlength="30" placeholder="Jurusan" required>

 <button type="submit" title="Submit" >Submit</button>
<a href="index.php"title="Kembali" ><img src="kembali.png"></a>
</form>
</div>
</body>
</html>

File : proses_tambah.php

<html>
<head>
<title>Input Data</title>
<link rel="shortcut icon" href="icon.png" />
</head>
<body>
<?php
include ("koneksi.php");
$nim=$_POST['nim'];
$nama=$_POST['nama'];
$kelas=$_POST['kelas'];
$jurusan=$_POST['jurusan'];

 $sql = mysql_query("select * from mahasiswa where nim='$nim'");
$hasil = mysql_num_rows($sql);
if ($hasil > 0){
echo "";
echo "";}
$sql="INSERT INTO mahasiswa(`nim`, `nama`, `kelas`, `jurusan`) VALUES ('$nim','$nama','$kelas','$jurusan')";
if (mysql_query($sql)){
echo"";}
 else{
echo "";}
?>
</body>
</html>

File : edit.php

<html>
<head>
<title>Edit Data  </title>
<link rel="shortcut icon" href="icon.ico" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<?php
include "koneksi.php";
$nim =$_GET['nim'];
$row = mysql_query("select * from mahasiswa where nim='$nim'");
$data = mysql_fetch_array($row);
?>
<body onLoad="document.forms.form.nim.focus()">
<div id="form" class="form1">
<form id="form" name="form" method="post" action="proses_edit.php?nim=<?php echo '$nim';?>
">
<h1>
Form Edit</h1>
<label>NIM</label>
   <input type="text"  name="nim" id="nim" class ="highlight"  maxlength="10"   value="<?php echo$data['nim'];?>" required>

  <label>Nama</label>
   <input type="text"  name="nama" id="nama" class ="highlight"  maxlength="25"  value="<?php echo$data['nama'];?>" required>

  <label>Kelas</label>
   <input type="text"  name="kelas" id="kelas" class ="highlight" maxlength="1"  value="<?php echo$data['kelas'];?>" required>

  <label>Jurusan</label>
   <input type="text"  name="jurusan" id="jurusan" class ="highlight" maxlength="30"  value="<?php echo$data['jurusan'];?>" required>

 <button type="submit" title="Submit" >Submit</button>
<a href="tampil.php" title="Kembali"><img src="kembali.png"></a>
</form>
</div>
</body>
</html>

File : proses_edit.php 

<html>
<head>
<title>Edit Data</title>
<link rel="shortcut icon" href="icon.png" />
</head>
<body>
<?php
include("koneksi.php");
$nim=$_POST['nim'];
$nama=$_POST['nama'];
$kelas=$_POST['kelas'];
$jurusan=$_POST['jurusan'];
$simpan=mysql_query("UPDATE `mahasiswa` SET `nama`='$nama',`kelas`='$kelas',`jurusan`='$jurusan' WHERE `nim`='$nim'");
if($simpan)
{echo"";}
else
{echo"";}
?>

 </body>
</html>

File : hapus.php

<html>
<head>
<title>Hapus Data</title>
<link rel="shortcut icon" href="icon.ico" />
</head>
<body>
<?php
include ("koneksi.php");
$nim=$_GET['nim'];
$hapus=mysql_query("delete from mahasiswa where nim='$nim'");
if($hapus)
{echo "";}
else
{echo "";}
?>

 </body>
</html>

Ketiga Buat file css agar tampilan web lebih menarik

File : style.css

body {
        font-family: verdana;
        font-size: 12px;
  background: url(index.png);
  background-repeat:no-repeat;
  background-position:50% 15%;
  }

.form1 {
        margin: 0 auto;
        width: 400px;
        padding: 10px;
}

 #form {
        border: solid 2px #b7ddf2;
        background: #ebf4fb;
}

 #form h1 {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 8px;
        border-bottom: solid 1px #b7ddf2;

 }

 #form img{
  width:40px;
  height:40px;
     padding-left:5px;
  margin-left:10px;
  margin-right:20px;
  margin-top:60px;
  float:left; }

 #form p {
        font-size: 11px;
        color: #666666;
        margin-bottom: 20px;
        padding-bottom: 10px;
}

 #form label {
        display: block;
        font-weight: bold;
        text-align: right;
        width: 125px;
        float: left;
  padding:5px;
 
}

 #form .small {
        color: #666666;
        display: block;
        font-size: 11px;
        font-weight: normal;
        text-align: right;
        width: 140px;
}

 #form input {
        float: left;
        font-size: 12px;
        padding: 4px 2px;
        border: solid 1px #aacfe4;
        width: 200px;
        margin: 2px 0 20px 10px;
 
}

 #form input.highlight{
        background: #f9f9f9;
        border: solid 1px #CCCCCC;
        padding: 5px;
}

 #form input.highlight:focus {
        border: solid 1px #D9AD00;
        background: #FFF7D7;
}

 #form button{
  border:1px solid #ff6262; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:12px;font-family:arial, helvetica, sans-serif; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
  background-color: #ff9a9a; background-image: -webkit-gradient(linear, left top, left bottom, from(#ff9a9a), to(#ff4040));
  background-image: -webkit-linear-gradient(top, #ff9a9a, #ff4040);
  background-image: -moz-linear-gradient(top, #ff9a9a, #ff4040);
  background-image: -ms-linear-gradient(top, #ff9a9a, #ff4040);
  background-image: -o-linear-gradient(top, #ff9a9a, #ff4040);
  background-image: linear-gradient(to bottom, #ff9a9a, #ff4040);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff9a9a, endColorstr=#ff4040);
  clear: both;
  width:200px;
  margin-top:10px;
        margin-left: 70px;
  margin-bottom:50px;
  }

  
#form button:hover{ 
border:1px solid #ff3434;
 background-color: #ff6767; background-image: -webkit-gradient(linear, left top, left bottom, from(#ff6767), to(#ff0d0d));
 background-image: -webkit-linear-gradient(top, #ff6767, #ff0d0d);
 background-image: -moz-linear-gradient(top, #ff6767, #ff0d0d);
 background-image: -ms-linear-gradient(top, #ff6767, #ff0d0d);
 background-image: -o-linear-gradient(top, #ff6767, #ff0d0d);
 background-image: linear-gradient(to bottom, #ff6767, #ff0d0d);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff6767, endColorstr=#ff0d0d);
 cursor:pointer;
 }

  table, th, td {
    border-collapse:collapse;
    border:1px solid #999;
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
}

 h1 {
   font-family:Tahoma, Geneva, sans-serif;
            font-size: 18 px;
            font-weight: bold;
            text-align:center;
   margin-top:10px;
   }

 .head {
background-color: #d3d3d3; background-image: -webkit-gradient(linear, left top, left bottom, from(#d3d3d3), to(#707070));
 background-image: -webkit-linear-gradient(top, #d3d3d3, #707070);
 background-image: -moz-linear-gradient(top, #d3d3d3, #707070);
 background-image: -ms-linear-gradient(top, #d3d3d3, #707070);
 background-image: -o-linear-gradient(top, #d3d3d3, #707070);
 background-image: linear-gradient(to bottom, #d3d3d3, #707070);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d3d3d3, endColorstr=#707070);
 }
.head th {
    padding:10px;
    color:#333;
    text-shadow:1px 1px 0px #CCC;
    font-size:14px;
}

 .satu {
    background-color:#E6E6E6;
}

 .satu:hover {
    background-color:#49c0f0;
    font-weight:bold;
    cursor:pointer;
}

 .button_example{
border:1px solid #df0909; -webkit-border-radius: 50px; -moz-border-radius: 50x;border-radius: 50px;font-size:250%;font-family:arial, helvetica, sans-serif; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-align:center;font-weight:bold; color: #FFFFFF;
 height:40px;
 width:480px;
 top: 20%;
 left: 30%;
 right:25%;
 position: fixed;
 background-color: #f62b2b; background-image: -webkit-gradient(linear, left top, left bottom, from(#f62b2b), to(#d20202));
 background-image: -webkit-linear-gradient(top, #f62b2b, #d20202);
 background-image: -moz-linear-gradient(top, #f62b2b, #d20202);
 background-image: -ms-linear-gradient(top, #f62b2b, #d20202);
 background-image: -o-linear-gradient(top, #f62b2b, #d20202);
 background-color: #e40a0a; background-image: -webkit-gradient(linear, left top, left bottom, from(#e40a0a), to(#9f0202));
 background-image: -webkit-linear-gradient(top, #e40a0a, #9f0202);-image: linear-gradient(to bottom, #f62b2b, #d20202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f62b2b, endColorstr=#d20202);
 }

 .button_example:hover{
 border:1px solid #b30808;
 background-image: -moz-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -ms-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -o-linear-gradient(top, #e40a0a, #9f0202);
 background-image: linear-gradient(to bottom, #e40a0a, #9f0202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e40a0a, endColorstr=#9f0202);
}

 .button_example2{
border:1px solid #df0909; -webkit-border-radius: 50px; -moz-border-radius: 50x;border-radius: 50px;font-size:250%;font-family:arial, helvetica, sans-serif; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-align:center;font-weight:bold; color: #FFFFFF;
 height:40px;
 width:480px;
 top: 40%;
 left: 30%;
 right:25%;
 position: fixed;
 background-color: #f62b2b; background-image: -webkit-gradient(linear, left top, left bottom, from(#f62b2b), to(#d20202));
 background-image: -webkit-linear-gradient(top, #f62b2b, #d20202);
 background-image: -moz-linear-gradient(top, #f62b2b, #d20202);
 background-image: -ms-linear-gradient(top, #f62b2b, #d20202);
 background-image: -o-linear-gradient(top, #f62b2b, #d20202);
 background-color: #e40a0a; background-image: -webkit-gradient(linear, left top, left bottom, from(#e40a0a), to(#9f0202));
 background-image: -webkit-linear-gradient(top, #e40a0a, #9f0202);-image: linear-gradient(to bottom, #f62b2b, #d20202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f62b2b, endColorstr=#d20202);
 }

 .button_example2:hover{
 border:1px solid #b30808;
 background-image: -moz-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -ms-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -o-linear-gradient(top, #e40a0a, #9f0202);
 background-image: linear-gradient(to bottom, #e40a0a, #9f0202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e40a0a, endColorstr=#9f0202);
}

 .img{
     padding-left:5px;
  margin-left:20px;
  margin-right:20px;
  margin-top:15px;
  float:left; }

Tags :

10 comments:

  1. Muhammad Abdul Ghofur4 September 2015 at 22:55

    Terimakasih ya gan atas pengetahuanya tentang Aplikasi data mahasiswa dengan php Salam kenal gan,,.,.,
    Materi TIK, TKJ, dan Perkuliyahan
    Download Aplikasi atau softwere

    ReplyDelete
  2. Aris4 February 2016 at 19:33

    kok blank gan pass mbukak http://localhost/Mahasiswa/proses_tambah.php

    ReplyDelete
    Replies
    1. Wahyu Saputra15 February 2016 at 01:52

      Proses tambah itu berfungsi sebagai proses penambahan data ketika mengisi data di form tambah.php maka dari itu tidak ada tampilan apa2 di proses_tambah.php

      Delete
    2. Unknown15 February 2016 at 16:44

      iya gan trimakasih

      Delete
    3. Sang Pencerah2 May 2020 at 23:05

      pada Menut Edit g bisa diupdate gan

      Delete
  3. Unknown17 December 2017 at 19:55

    Terimakasi
    Kunjungi juga blog kami
    http://blog.binadarma.ac.id/fatoni

    ReplyDelete
  4. MT PRADILLAH25 April 2018 at 05:29

    Cara buka pertama kali gmna yh min

    ReplyDelete
  5. Nature lovers17 June 2019 at 10:02

    Gambar sql nya kok burem ya.
    Gimana dong ini kak?
    Harap bantuannya

    ReplyDelete

Subscribe to: Post Comments ( Atom )
Powered by Blogger.

Created By Themexpose | Distributed By Blogger Themes