Membuat CRUD dengan Django - Menginput data ke database

Tutorial ini merupakan tutorial lanjutan dari tutorial debelumnya yaitu django crud tentang Membuat CRUD dengan Django - Menampilkan data dari database. pada tutorial ini kita akan belajar cara menginput data ke database dengan framework django. silahkan simak contoh dan penjelasan berikut ini tentang cara Membuat CRUD dengan Django - Menginput data ke database.

Bagi kamu yang belum membaca tutorial sebelumnya tentang cara menampilkan data dari database dengan django bisa membaca nya terlebih dulu dengan klik link di bawah ini.

Baca : Membuat CRUD dengan Django - Menampilkan data dari database

Cara Menginput data ke database Mysql menggunakan Django

pertama kita akan menambahkan button untuk redirect ke halaman tambah data.

edit file templates/index.html

<center><a href="/tambah" class="btn btn-primary">Add New Record</a></center>

Setelah itu kita akan membuat route url "tambah" pada project kita,

kita tambah kode dibawah ini di file crudtutorial/urls.py

path('tambah',views.tambah),

Sehingga kode lengkapnya pada file tersebut menjadi seperti ini,

from django.contrib import admin
from django.urls import path
from mahasiswa import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('',views.index),
    path('tambah',views.tambah),
]

Penjelasan:

dari kode diatas kita hanya menambahkan 1 line saja, dimana ketika kamu akan mengakses dengan url http://127.0.0.1:8000/tambah, maka dia akan mengeksekusi / menjalankan kode yang ada pada function tambah terdapat pada file mahasiswa/views.py.

Seperti apa kodenya?

Berikut adalah kode dari function tambah pada mahasiswa/views.py.

def tambah(request):
    return render(request,"tambahdata.html")

Simpel bukan?

Iya, karena kita hanya memanggil templatenya saja. Nah, dalam return tersebut terdapat tambahdata.html , file tersebut adalah layout untuk kita menambahkan data ke database.

Mari kita buat layout tersebut, buatlah file tambahdata.html pada folder templates,

lalu copas kode dibawah ini.

<!DOCTYPE html>
<html>
<head>
	<title>Membuat CRUD sederhana menggunakan framework Django</title>	
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>    
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap4.min.css">

</head>
<body>
	<center>
        <h1>Membuat CRUD sederhana menggunakan framework Django</h1>
        <h3>Afrizal's Blog</h3>
	</center>
	<br/>
	<br/>
	<div class="container">
        {% if form.errors %}
            {% for field in form %}
                {% for error in field.errors %}
                    <div class="alert alert-danger">
                        <strong>{{ error|escape }}</strong>
                    </div>
                {% endfor %}
            {% endfor %}
            {% for error in form.non_field_errors %}
                <div class="alert alert-danger">
                    <strong>{{ error|escape }}</strong>
                </div>
            {% endfor %}
        {% endif %}
		<form method="POST">
            {% csrf_token %}  
            <table style="margin:20px auto;">
                <tr>
                    <td>NPM</td>
                    <td>
                    <input type="number" name="npm" value=""></td>
                </tr>
                <tr>
                    <td>Nama</td>
                    <td>
                    <input type="text" name="nama" value=""></td>
                </tr>
                <tr>
                    <td>Tanggal lahir</td>
                    <td>
                    <input type="date" name="tgl_lahir" value=""></td>
                </tr>
                <tr>
                    <td>Alamat</td>
                    <td>
                    <input type="text" name="alamat" value=""></td>
                </tr>
                    <td></td>
                    <td><input type="button" onclick = "window.history.back()" value="kembali"></td>
                    <td><input type="submit" value="Simpan"></td>
    
                </tr>
            </table>
        </form>	
    </div>
   
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js"></script>
    <script>
        $(document).ready(function() {
            $('#example').DataTable();
        } );
    </script>
</body>
</html>

Nah, ketika kalian mengeksekusi url "/tambah" maka sistem akan menampilkan layout tersebut.

Setelah sukses membuat layoutnya, selanjutnya kita akan membuat forms.py nya..

buat file tersebut letakkan pada folder mahasiswa.

# File mahasiswa/views.py
from django import forms
from .models import Data_mahasiswa

class BiodataMhs(forms.ModelForm):
    class Meta:
        model = Data_mahasiswa
        fields = "__all__"
        error_messages = {
            'npm': {
                'required': 'Anda harus mengisi form NPM'
            },
            'nama' : {
                'required': "Anda harus mengisi form Nama"
            },
            'tgl_lahir' : {
                'required': "Anda harus menset form Tanggal lahir"
            },
            'alamat':{
                'required': "Anda harus mengisi form Alamat"
            }
        }

Penjelasan:

Langkah awal kita harus mengimport fomrsnya dari django, dan tak lupa kita panggil model yang sebelumnya kita buat. bagi kalian yang belum tau model.py'nya seperti apa, silahkan baca postingan sebelumya.

Setelah itu buat class untuk salah satu model kita yaitu model Data_mahasiswa. Kita beri nama class tersebut BiodataMhs.

Didalam class tersebut kita inisialisasikan model kita adalah Data_mahasiswa,

variabel fields kita isikan "__all__" dimana ini kita ambil semua yang terdapat pada model tersebut.

setelah itu ada variabel error_messages, dimana variabel adalah menampilkan error handling ketika ada inputan yang kosong. Jika ingin membuat error handling sendiri, bisa dibaca dokumentasinya.

nah, setelah kita sudah menyelesaikan url, template, forms Selanjutnya kita akan mengedit bagian views.py yang kita buata tadi.

Loh kenapa diedit lagi? karena kita ingin mensubmit pada halaman form tersebut. maksudnya gimana? begini, ketika kita sudah mengisi pada halaman tambah data tersebut optomatis kita juga ingin dong yang kita isikan pada forms tersebut masuk kedalam database kita. Bagaimana caranya? oke baik, pertama kita buka mahasiswa/views.py yang kita buat tadi. Llau edit seperti kode dibawah.

from django.shortcuts import render, redirect, get_object_or_404 ## Tambahkan ini dibagian atas setalah import render
from .forms import BiodataMhs ## Tambahkan ini dibagian atas setalah import model

def tambah(request):
    form = BiodataMhs(request.POST or None, request.FILES or None)
    if request.method == 'POST':
        if form.is_valid():
            form.save()
            return redirect("/")
        pass
    return render(request,"tambahdata.html",{'form': form})

Penjelasan:

Langkah awal kita harus mengimport forms yang kita buat tadi, gunanya seperti validator atas apa yang kita inputkan. Setelah itu kita edit didalam function tambah.

Variabel form digunakan untuk menginisialisasikan bahwa variabel tersebut untuk mencheck apakah terdapat ada request post maupun request file lalu dikirimkan ke forms yang kita buat. Mangkanya didalam parameter tersebut ada or None , dimana dicheck apakah meminta request atau tidak.

Setelah itu kita akan membuat decision dengan kondisi apakah ada request dengan method Post.

Jika iya, maka akan dicek lagi dengan kondisi jika variabel form tadi sudah bener sesuai ketentuan apa belum (is_valid). nah jika sukses maka data ayng kamu inputkan akan disave ke database (save()). lalu akan meredirect ke halaman awal.

Nah, jika tidak terjadi request method maka dia hanya menampilkan template tambahdata.html

Kita jalankan server menggunakan perintah