Cara Membuat Button di Form Django Admin

Pernah kah kalian berfikir ingin memodifikasi form django admin standar ? misalkan ingin menambahkan button didalam form detailnya atau di dalam tabel datanya.

Disini saya akan membahas bagaimana membuat tombol button didalam form Django admin seperti dibawah ini :

Saya akan tutorialkan sejelas jelasnya dengan mengikuti tahapan dibawah ini, harap lakukan dengan teliti.

Buat file dengan nama “forms.py”

Form ini dibuat didalam direktori app kalian misalkan nama projek kalian sisakad dan didalam nya ada app karyawan, nah kalian buat file itu didalam folder karyawan.

Buat folder dengan nama “templates”

Folder ini dibuat didalam app karyawan (mengarah pada contoh diatas)

Buat file dengan nama “auth_button_widget.html”

Kalian buat file html didalam folder “templates” yang sudah dibuat tadi.

Setelah langkah diatas dibuat sekarang kita masuk ke scriptnya, disini saya hanya mentutorkan sampai muncul button click dan untuk memasukan urlnya.

Buka file “forms.py”

from django import forms
from django.utils.safestring import mark_safe
from django.template.loader import render_to_string
from karyawan.models import ProfilKaryawan

class ButtonWidget(forms.Widget):
    template_name = ‘auth_button_widget.html‘

    def render(self, name, value, attrs=None):
        context = {
            ‘url’: ‘/’
        }
        return mark_safe(render_to_string(self.template_name, context))

class ProfilKaryawanForm(forms.ModelForm):
    button = forms.CharField(required=False, widget=ButtonWidget)

    class Meta:
        model = ProfilKaryawan
        fields = ‘__all__’

Buka file “auth_button_widget.html”

<style>
.button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}
.button3 {border-radius: 8px;}
</style>

<button class=”button button3″>   Print to PDF   </button>

Buka file admin.py
Tambahkan ini dipaling atas :

from reins.forms import *

Sekarang coba kalian refresh dan buka form nya, jika tidak muncul coba di ulangi lagi langkah demi langkahnya.

Leave a Reply Cancel reply