Assalamualaikum wr. wb.
Pada kesempatan kali ini saya akan membuat web sederhana dari framework dan thymleaf. Editor yang saya gunkan yaitu netbeans. ok, langsung saja kita pada tahap-tahap membuat sederhana.
seperti pada gambar dibawah ini:
Kemudian kita clean and buil project tersebut. Tapi sebelumya buat terlebih dahulu database, seperti pada gambar diatas nama databasenya adalah db_absensi.
Jiga hasil running sucsess kemudian kita cek di command promt apakah berhasil .
Dari gambar diatas kita sudah berhasil.
Selanjutnya kita akan tampilkan di web dengan cara kita buat packages di source packages dengan nama controller > lalu buat file dengan nama mahasiswahtmlcotroller.
Script file mahasiswahtmlcontroller :
@Controller
@RequestMapping("/mahasiswa")
public class MahasiswaHtmlController {
@Autowired
private MahasiswaDao md;
@RequestMapping("/list")
public void daftarMahasiswa (Model m){
m.addAttribute("daftarMahasiswa", md.findAll());
}
@RequestMapping("/hapus")
public String hapus (@RequestParam("id") String id){
md.delete(id);
return "redirect:list";
}
@RequestMapping(value = "/form", method = RequestMethod.GET)
public String tampilkanForm (@RequestParam(value = "id",
required = false) String id, Model m){
m.addAttribute("mahasiswa", new Mahasiswa ());
if (id != null && !id.isEmpty()){
Mahasiswa mhs = md.findOne(id);
if (mhs != null){
m.addAttribute("mahasiswa", mhs);
}
}
return "/mahasiswa/form";
}
@RequestMapping(value = "/form", method = RequestMethod.POST)
public String simpanData (@Valid Mahasiswa mhs,
BindingResult error){
if (error.hasErrors()){
return "/peserta/form";
}
md.save(mhs);
return "redirect:list";
}
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<title>home</title>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<center>
<h1>Daftar Mahasiswa</h1>
<a herf="#" th:href="@{/mahasiswa/form}">
Tambah Data Mahasiswa</a>
<table border="1">
<thead>
<tr>
<th>NIM</th>
<th>Nama</th>
<th>Email</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
<tr th:each="mhs : ${daftarMahasiswa}">
<td th:text="${mhs.nim}"></td>
<td th:text="${mhs.nama}"></td>
<td th:text="${mhs.email}"></td>
<td>
<a herf="#" th:href="@{/mahasiswa/edit (id=${mhs.id})}">Edit</a>|
<a href="#" th:href="@{/mahasiswa/form(id=${mhs.id})}">Lihat</a>|
<a href="#" th:href="@{/mahasiswa/hapus(id=${mhs.id})}">Hapus</a>
</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>home</title>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<h1>Tamba Data Peserta</h1>
<form action="#" th:action="@{/mahasiswa/form}" th:object="${mahasiswa}" method="post">
<table border="1">
<tbody>
<tr>
<td>NIM</td>
<td><input type="text" th:field="*{nim}"/></td>
<td th:if="${#fields.hasErrors('nim')}"
th:error="*{nim}">Pesan Error</td>
</tr>
<tr>
<td>Nama</td>
<td><input type="text" th:field="*{nama}"/></td>
<td th:if="${#fields.hasErrors('nama')}"
th:error="*{nama}">Pesan Error</td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" th:field="*{email}"/></td>
<td th:if="${#fields.hasErrors('email')}"
th:error="*{email}">Pesan Error</td>
</tr>
<tr>
<td> </td>
<td colspan="2" align="center">
<input type="submit" value="simpan"/>
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
Kemudain kita clean and build dan juga kita running setelah berhasil, kita panggil dari browser :
Dari gambar diatas kita sudah berhasil membuat crud dari spring pramework.
