Senin, 03 September 2018

Tugas WEB 6 PHP

NAMA database :Akademik
Config.php:
?php
$server = “localhost”;
$user = “root”;
$password = “”;
$nama_database = “akademik”;
$db = mysqli_connect($server, $user, $password, $nama_database);
if( !$db){
die(“Gagalterhubungdengandatabase: ” . mysqli_connect_error());
}
?>
indeks.php:
<!DOCTYPE html>
<html>
<head>
<title>Pendaftaran Mahasiswa Baru | Fakultas Ilmu Komputer</title>
</head>
<body>
<header>
<h2>Pendaftaran Mahasiswa Baru</h2>
<h1>UNIVERSITAS MUSLIM INDONESIA</h1>
</header>
<h4>Menu</h4>
<nav>
<ul>
<li><a href=”form-daftar.php”>Daftar Baru</a></li>
<li><a href=”list-mhs.php”>Pendaftar</a></li>
</ul>
</nav>
</body>
</html>
list-mhs.php:
<?php
include(“config.php”);
?>
<!DOCTYPE html>
<html>
<head>
<title>Pendaftaran Mahasiswa Baru| UMI</title>
</head>
<body>
<header>
<h3>Mahasiswayang sudahmendaftar</h3>
</header>
<nav><a href=”form-daftar.php”>[+] TambahBaru</a></nav><br>
<table border=”1″>
<thead>
<tr>
<th>No</th>
<th>Nama</th>
<th>Alamat</th>
<th>JenisKelamin</th>
<th>Agama</th>
<th>SekolahAsal</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
<?php
$sql= “SELECT * FROM calon_mahasiswa”;
$query = mysqli_query($db, $sql);
while($siswa= mysqli_fetch_array($query)){
echo “<tr>”;
echo “<td>”.$siswa[‘id’].”</td>”;
echo “<td>”.$siswa[‘nama’].”</td>”;
echo “<td>”.$siswa[‘alamat’].”</td>”;
echo “<td>”.$siswa[‘jenis_kelamin’].”</td>”;
echo “<td>”.$siswa[‘agama’].”</td>”;
echo “<td>”.$siswa[‘sekolah_asal’].”</td>”;
echo “<td>”;
echo “<a href=’form-edit.php?id=”.$siswa[‘id’].”‘>Edit</a> | “;
echo “<a href=’hapus.php?id=”.$siswa[‘id’].”‘>Hapus</a>”;
echo “</td>”;
echo “</tr>”;}?>
</tbody>
</table>
<p>Total:
<?php
echo mysqli_num_rows($query)
?>
</p>
</body>
</html>
form-daftar.php:
<!DOCTYPE html>
<html>
<head>
<title>Formulir Pendaftaran Mahasiswa Baru| UMI</title>
</head>
<body>
<header>
<h3>Formulir Pendaftaran Mahasiswa Baru</h3>
</header>
<form action=”proses-pendaftaran.php” method=”POST”>
<fieldset>
<p><label for=”nama”>Nama : </label><input type=”text” name=”nama” placeholder=”Nama Lengkap” /></p>
<p><label for=”alamat”>Alamat : </label>
<textarea name=”alamat”></textarea>
</p>
<p><label for=”jenis_kelamin”>Jenis Kelamin: </label><label><input type=”radio” name=”jenis_kelamin” value=”laki-laki”>
Laki-laki</label><label><input type=”radio” name=”jenis_kelamin” value=”perempuan”> Perempuan</label></p>
<p><label for=”agama”>Agama: </label><select name=”agama”>
<option>Islam</option>
<option>Kristen</option>
<option>Hindu</option>
<option>Budha</option>
<option>Atheis</option>
</select></p>
<p><label for=”sekolah_asal”>Sekolah Asal: </label><input type=”text” name=”sekolah_asal” placeholder=”Nama Sekolah” /></p>
<p><input type=”submit” value=”Daftar” name=”daftar” /></p>
</fieldset>
</form>
</body>
</html>
Proses-pendaftaran.php:
<?php
include(“config.php”);
// cek apakah tombol daftar sudah di klik atau belum?
if(isset($_POST[‘daftar’])){
// ambildata dari formulir
$nama= $_POST[‘nama’];
$alamat= $_POST[‘alamat’];
$jk= $_POST[‘jenis_kelamin’];
$agama = $_POST[‘agama’];
$sekolah= $_POST[‘sekolah_asal’];
// buat query
$sql= “INSERT INTO calon_mahasiswa(nama, alamat, jenis_kelamin, agama, sekolah_asal) VALUE (‘$nama’, ‘$alamat’, ‘$jk’, ‘$agama’, ‘$sekolah’)”;
$query = mysqli_query($db, $sql);
// apakahquery simpan berhasil?
if($query) {
// jika berhasil alihkan kehalaman index.php dengan status=sukses
header(‘Location: index.php?status=sukses’);
} else {
// kalau gagal alihkan kehalaman indek.php dengans tatus=gagal
header(‘Location: index.php?status=gagal’);
}
} else {
die(“Aksesdilarang…”);
}
?>
Form-edit.php:
<?php
include(“config.php”);
if( isset($_GET[‘id’]) ){
$id = $_GET[‘id’];
$sql = “SELECT * FROM calon_mahasiswa WHERE id = $id”;
$query = mysqli_query($db, $sql);
if(mysqli_num_rows($query) > 0) {
while($siswa = mysqli_fetch_array($query)){
$nama = $siswa[‘nama’];
$alamat = $siswa[‘alamat’];
$sekolah = $siswa[‘sekolah_asal’];
}
} else {
die(‘Data Tidak Ditemukan!’);
}
} else {
die(‘Akses Ditolak!’);
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Edit Formulir Pendaftaran Mahasiswa Baru| UMI</title>
</head>
<body>
<header>
<h3>Edit Formulir Pendaftaran Mahasiswa Baru</h3>
</header>
<form action=”proses-edit.php” method=”POST”>
<fieldset>
<input type=”hidden” name=”id” value=”<?php echo $id;?>”>
<p><label for=”nama”>Nama : </label><input type=”text” name=”nama” value=”<?php echo $nama;?>” placeholder=”Nama Lengkap” /></p>
<p><label for=”alamat”>Alamat : </label>
<textarea name=”alamat”><?php echo $alamat;?></textarea>
</p>
<p><label for=”jenis_kelamin”>Jenis Kelamin: </label><label><input type=”radio” name=”jenis_kelamin” value=”laki-laki”>
Laki-laki</label><label><input type=”radio” name=”jenis_kelamin” value=”perempuan”> Perempuan</label></p>
<p><label for=”agama”>Agama: </label><select name=”agama”>
<option>Islam</option>
<option>Kristen</option>
<option>Hindu</option>
<option>Budha</option>
<option>Atheis</option>
</select></p>
<p><label for=”sekolah_asal”>Sekolah Asal: </label><input type=”text” name=”sekolah_asal” value=”<?php echo $sekolah;?>” placeholder=”Nama Sekolah” /></p>
<p><input type=”submit” value=”Edit” name=”simpan” /></p>
</fieldset>
</form>
</body>
</html>
Proses-edit.php:
<?php
include(“config.php”);
// cekapakah tombol simpan sudahdi klik atau belum?
if(isset($_POST[‘simpan’])){
// ambildata dari formulir
$id = $_POST[‘id’];
$nama= $_POST[‘nama’];
$alamat= $_POST[‘alamat’];
$jk= $_POST[‘jenis_kelamin’];
$agama = $_POST[‘agama’];
$sekolah= $_POST[‘sekolah_asal’];
// buatquery update
$sql= “UPDATE calon_mahasiswa SET nama=’$nama’, alamat=’$alamat’, jenis_kelamin=’$jk’,
agama=’$agama’, sekolah_asal=’$sekolah’ WHERE id=$id”;
$query = mysqli_query($db, $sql);
// apakahquery update berhasil?
if( $query ) {
// kalauber hasil alihkan kehalaman list-mhs.php
header(‘Location: list-mhs.php’);
} else {
// kalau gagal tampilkan pesan
die(“Gagal Menyimpan Perubahan…”);
}
} else {
die(“Akses dilarang…”);
}
?>
hapus.php:
<?php
$server = “localhost”;
$user = “root”;
$password = “”;
$nama_database = “akademik”;
$db = mysqli_connect($server, $user, $password, $nama_database);
if( !$db){
die(“Gagalterhubungdengandatabase: ” . mysqli_connect_error());
}
?>

Tugas WEB 5 JavaScript

Java script merupakan bahasa pemrograman yang berada pada clien side fungsinya membuat Web lebih interaktif dan mengurangi beban kinerja server.
Soal Tugas 5(JavaScript)
Source Code:
Screenshot_115
Output Baca:
Screenshot_116
Output Hapus:
Screenshot_117

Tugas WEB 4 CSS

Cascading Style Sheet(CSS): Mekanisme sederhana untuk menambahkan style misalnya font , warna , dan layout untuk WEB.
Style memberikan kontrol kuat atas penyajian halaman Web
Soal 1
Source Code:
1_1
Output:
1
Soal 2
Source Code:
2_2
Output:
2
Soal 3
Source Code:
3_3
Output:
3
Soal 4
Source Code:
4_4
Output:
4
Soal 5
Source Code:
5_5
Output:
5
Soal 6
Source Code:
6_6
Output:
6
Soal 7
Source Code:
7_7
Output:
7
Soal 8
Source Code:
8_8
Output:
8
Soal Form 01
Source Code:
FORM1_1
Output:
FORM1
Soal form 02
Source Code:FORM2_2
Output:
FORM2
Soal 10
Source Code:
10_10
Output:
10
Soal 11
Source Code:
11_11
Output:
11
Soal 12
Source Code:
12_12
Output:
12
Soal 13
Source Code:
13_13
Output:
13
Soal Local Style Sheet
Source Code:
local
Output:
Screenshot_109
Soal Internal Style Sheet
Source code:
internal
Output:
Screenshot_109
Soal External Style Sheet
Source Code:
Html
externalcss
CSS
externalhtml
Output:
Screenshot_109

Tugas WEB 3 HTML

SOAL 1
Source Code
<html>
<head>
<title>Soal 1</title>
</head>
<body>
<h1>Assalamualaikum WR. Wb</h1>
<h2>Welcome To My University</h2>
<hr>
<p>Contact us:simpadu.umi.ac.id</p>|
</body>
</html>
Output:
Screenshot_54
SOAL 2
Source Code
<html>
<head>
<title>Soal 2</title>
</head>
<body>
<h1>Fakultas Ilmu Komputer</h1>
<hr/>
<h2>Jurusan Teknik Informatika</h2>
</body>
</html>
Output:
Screenshot_55
SOAL 3
Source CODE:
<html>
<head>
<title>Soal 3</title>
</head>
<body>
a big <font size=”20″ face=”arial” color=”red”>HELLO</font> from me
</body>
</html>
Output
Screenshot_57
SOAL 4
Source Code:
<html>
<head>
<title>Soal 4</title>
</head>
<body>
<center>
<table border=”1″ width=”400″>
<thead>
<tr>
<th align=”center”>NO.</th>
<th align=”center” >NIM</th>
<th align=”center”>NAMA</th>
</tr>
</thead>
<tbody>
<tr>
<td align=”center”>1.</td>
<td>04102001</td>
<td>Nur Qomari</td>
</tr>
<tr bgcolor=”yellow”>
<td align=”center”><i>2.</i></td>
<td><i>04102002</i></td>
<td><i>Lukmanul Khakim</i></td>
</tr>
<tr>
<td align=”center”>3.</td>
<td>04102003</td>
<td>Indra Cahyo K.</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
Output
Screenshot_58
SOAL 5
Source Code
<html>
<head>
<title>Soal 5</title>
</head>
<body bgcolor=”grey”>
<center>
<table border=”1″ bordercolor=”grey” width=”400″ bgcolor=”white”>
<thead>
<tr>
<th align=”center” colspan=”3″>DAFTAR MAHASISWA</th>
</tr>
</thead>
<tbody>
<tr>
<td align=”center”>1.</td>
<td>04102001</td>
<td>Nur Qomari</td>
</tr>
<tr bgcolor=”yellow”>
<td align=”center”><i>2.</i></td>
<td><i>04102002</i></td>
<td><i>Lukmanul Khakim</i></td>
</tr>
<tr>
<td align=”center”>3.</td>
<td>04102003</td>
<td>Indra Cahyo K.</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
Output
Screenshot_59
SOAL 6
Source Code
<html>
<head>
<title>Soal 6</title>
</head>
<body>
<center>
<table border=”1″ bordercolor=”grey” width=”400″ bgcolor=”yellow”>
<thead>
<tr>
<th align=”center” colspan=”3″>KELOMPOK</th>
</tr>
</thead>
<tbody>
<tr>
<td align=”center”><font color=”red”>I</font></td>
<td><font color=”red”>04102001</font></td>
<td><font color=”red”>Nur Qomari</font></td>
</tr>
<tr>
<td align=”center” rowspan=”2″>II</td>
<td>04102002</td>
<td>Lukmanul Khakim</td>
</tr>
<tr>
<td>04102003</td>
<td>Indra Cahyo K.</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
Output
Screenshot_60
Image Tag
SOAL 4
Source Code
<html>
<head>
<title>Soal 7</title>
</head>
<body>
<center>
<table border=”5″ bordercolor=”grey” width=”400″>
<tr bgcolor=”grey”>
<td><img bordercolor=”grey” width=”80″ src=”gambar/logo_umi.png” alt=””></td>
<td><font color=”blue”>Welcome To Muslim University Of Indonesia</font></td>
</tr>
</table>
</center>
</body>
</html>
Output
soal 7
SOAL 5
Source Code
<html>
<head>
<title>Soal 8</title>
</head>
<body>
<center>
<table border=”1″ style=”border-collapse: collapse” width=”400″>
<thead bgcolor=”#9bf957″>
<tr>
<th rowspan=”2″>NO</th>
<th colspan=”2″>MAHASISWA</th>
<th rowspan=”2″>NILAI</th>
</tr>
<tr>
<th>NIM</th>
<th>NAMA</th>
</tr>
</thead>
<tbody>
<tr>
<td align=”center”>1.</td>
<td>04102001</td>
<td>Nur Qomari</td>
<td align=”center”>B</td>
</tr>
<tr>
<td align=”center”>2.</td>
<td>04102002</td>
<td>Lukmanul khakim</td>
<td align=”center”>A</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
Output
Screenshot_61
SOAL 6
Source Code
<html>
<head>
<title>Soal 9</title>
</head>
<body>
<center>
<table border=”5″>
<thead>
<tr>
<th colspan=”2″>Welcome to My Gallery</th>
</tr>
</thead>
<tbody bgcolor=”#d1d1d1″>
<tr align=”center”>
<td bgcolor=”white”>
<img border=”1″ src=”bunga1.png” alt=””><br>
Photo1
</td>
<td bgcolor=”white”>
<img border=”1″ src=”bunga2.png” alt=””><br>
Photo2
</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
Output
Screenshot_64.png
SOAL 7
Source Code
<html>
<head>
<title>Soal 10</title>
</head>
<body>
<marquee bgcolor=”pink” behavior=”alternate” width=”100%”>
<font color=”blue”>This is an example of marquee using alternate as behavior</font>
</marquee>
</body>
</html>
Output
Screenshot_65
Soal 8
Source
<html>
<head>
<title> My web page using marquee </title></head>
<body>
<font size=”5″
face=”courier”
color=pink>
<marquee width=100%
behavior=slide
bgcolor=blue >
This is an example of a marquee using slide as behavior…
</marquee></font>
</body>
</html>
Output
Screenshot_66
SOAL 9
Source Code
<html>
<head>
<title> My web page using marquee
</title></head>
<body>
<font size=”5″
face=”courier”
color=pink>
<marquee width=100% behavior=scroll bgcolor=blue loop=3>
This is an example of a marquee using scroll as
behavior…
</marquee></font>
</body>
</html>
Output
Screenshot_67
SOAL 10
Source Code
<html>
<head>
<title>Soal 15</title>
</head>
<body>
<h1>Login</h1>
<form action=””>
<table>
<tr>
<td>Username : </td>
<td>
<input type=”text” maxlength=”10″>
</td>
</tr>
<tr>
<td>Password : </td>
<td>
<input type=”text” maxlength=”10″>
</td>
</tr>
</table>
<br>
<button type=”submit”>Submit</button>
</form>
</body>
</html>
Output
Screenshot_68
SOAL 11
Source Code
<html>
<head>
<title>Soal 14</title>
</head>
<body>
<h1>Fakultas ilmu komputer</h1>
<form action=””>
Program studi :
<select>
<option value=””>System informasi</option>
<option value=””>Tehnik informatika</option>
<option value=””><button type=”submit”>Submit</button></option>
</select>
</form>
</body>
</html>
Output
Screenshot_69
SOAL 12
Source Code
<html>
<head>
<title>Soal 15</title>
</head>
<body>
<h1>Login</h1>
<form action=”” method=”post”>
<table>
<tr>
<td>Username : </td>
<td>
<input type=”text” name=”Username” maxlength=”10″>
</td>
</tr>
<tr>
<td>Password : </td>
<td>
<input type=”text” name=”Password” maxlength=”10″>
</td>
</tr>
</table>
<br>
<button type=”submit”>Login</button>
</form>
</body>
</html>
Output
Screenshot_70
SOAL 13
Source Code
<html>
<head>
<title>Soal 16</title>
</head>
<body>
<form action=”” method=”post”>
<label for=””>Nama: </label><br>
<input type=”text” disabled>
<br>
<br>
<label for=””>Alamat: </label><br>
<textarea cols=”30″ rows=”10″ disabled></textarea>
</form>
</body>
</html>
Output
Screenshot_71
SOAL 14
Source Code
<html>
<head>
<title>Soal 17</title>
</head>
<body>
<form action=”” method=”post”>
<label for=””>NIM: </label>
<input type=”text” value=”04102001″ disabled>
<br>
<br>
<label for=””>Nama: </label>
<input type=”text” value=”Nur Qomari” disabled>
</form>
</body>
</html>
Output
Screenshot_72
SOAL 15
Source Code
<html>
<head>
<title>Soal 18</title>
</head>
<body>
<i><font color=”blue”>Universitas Noratama Surabaya</font></i>
</body>
</html>
Output
Screenshot_73
SOAL 16
Source Code
<html>
<head>
<title>Soal 19</title>
</head>
<body>
<u>Sistem informasi & sistem komputer</u>
</body>
</html>
Output
Screenshot_74
SOAL 17
Source Code
<html>
<head>
<title>Soal 20</title>
</head>
<body>
<p>Daftar fakultas dan jurusan</p>
<ul>
<li>Fakultas Tehnik Sipil</li>
<li>Fakultas Hukum</li>
<li>Fakultas Ilmu Komputer <ul>
<li>Sistem Komputer</li>
<li>Sistem Informasi</li>
</ul></li>
</ul>
</body>
</html>
Output
Screenshot_75
SOAL 18
Source Code
<html>
<head>
<title>Soal 21</title>
</head>
<body>
<ol type=”A”>
<li>Fakultas Ilmu Komputer <ol type=”I”>
<li>Sistem Informasi</li>
<li>Sistem Komputer</li>
</ol></li>
<li>Fakultas Ekonomi <ol type=”I”>
<li>AKuntansi</li>
<li>Manajemen</li>
</ol></li>
</ol>
</body>
</html>
Output
Screenshot_76