Trong bài viết này, chúng ta sẽ xem cách sử dụng các widget trong một biểu mẫu Django. Các widget có thể rất hữu ích để làm cho giao diện người dùng tốt hơn. Widget là các phần tử html được hiển thị từ Django form, textarea, input, password input, v.v., tất cả đều là widget.
Đầu tiên, hãy tạo một dự án Django và một ứng dụng. Tôi đã tạo dự án với tên "tutorial14" và ứng dụng có tên "djangoFormWidget" .
Thêm ứng dụng trong settings.py và bao gồm URL của ứng dụng trong dự án urls.py.
Tạo mọi tệp và thư mục cơ bản như Mẫu, home.html, form.py.
Ví dụ
Trong urls.py của ứng dụng -
from django.urls import path,include
from . import views
urlpatterns = [
path('',views.home,name="home")
] Nó sẽ tạo một URL cơ bản cho chế độ xem kết xuất.
Trong views.py -
from django.shortcuts import render
from .forms import CommentForm
# Create your views here.
from django.views.decorators.csrf import csrf_exempt
@csrf_exempt
def home(request):
if request.method=='POST':
form=CommentForm(request.POST)
if form.is_valid():
form.save()
commentform=CommentForm()
return render(request,'home.html',{"commentform":commentform}) Tại đây, chúng tôi đã nhập biểu mẫu của mình và xử lý các yêu cầu POST và GET của nó.
Trong POST, chúng tôi lưu dữ liệu và trong GET, chúng tôi gửi biểu mẫu đến giao diện người dùng.
Trong models.py -
from django.db import models # Create your models here. class CommentModel(models.Model): comment=models.CharField(max_length=500)
Ở đây chúng tôi đã tạo một mô hình mà chúng tôi sẽ sử dụng trong biểu mẫu của chúng tôi. Chúng tôi cần mô hình này để sử dụng biểu mẫu.
Trong home.html -
<!DOCTYPE html>
<html>
<head>
<title>TUT</title>
</head>
<body>
{% for fm in commentform %}
<form method="post">
{%csrf_token%}
{{fm.errors}}<br>
{{fm.label}}:{{fm}}<br>
{%endfor%}
<button type="submit">Submit</button>
</form>
</body>
</html> Nó là một giao diện người dùng đơn giản, nơi chúng tôi hiển thị biểu mẫu của mình.
Trong form.py -
from django import forms
from .models import CommentModel
class CommentForm(forms.Form):
comment=forms.CharField(widget=forms.Textarea(attrs={'class':'comment','title':'add comment'})) # this is the line which is used for widget, here I added TextArea widget you can see we also assigned class to widget using attrs attribute.
def save(self):
data=self.data
modelRef=CommentModel(comment=data['comment'])
modelRef.save() Đó là nơi chúng tôi tạo ra hình thức của chúng tôi. Chúng tôi đã sử dụng tiện ích biểu mẫu Django được tích hợp sẵn để hiển thị một vùng văn bản trong biểu mẫu.
Đầu ra
