برنامه نویسی

نحوه سفارشی کردن ابزارک ها به شکل django

هنگام کار با فرم های Django ، یکی از اولین کارهایی که می خواهید انجام دهید این است که نحوه نگاه و رفتار زمینه های فرم شما را سفارشی کنید. این که آیا این کلاس های CSS را اضافه می کند ، متغیرها یا تغییر نوع ورودی ، Django روش های مختلفی را برای تغییر ابزارک ها به شما می دهد.

در این مقاله ، نحوه سفارشی کردن ابزارک ها در دو سناریو را طی خواهیم کرد:

  • یک فرم وانیلی ساده (بر اساس forms.Form)
  • یک فرم مدل (بر اساس forms.ModelForm)

بیایید شیرجه بزنیم.

1. سفارشی سازی ابزارک ها به شکل وانیل (forms.Form)

ما این فرم تماس را داریم.

from django import forms

class ContactForm(forms.Form):
    subject = forms.CharField(max_length=100)
    message = forms.CharField(widget=forms.Textarea)
    sender = forms.EmailField()
    cc_myself = forms.BooleanField()
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

گزینه ها:

  • گزینه 1: ویجت را درون خط تعریف کنید. ویجت را درست درون تعریف فیلد تنظیم می کنید.
  • گزینه 2: ویجت را در تعریف فرم اصلاح کنید.
  • گزینه 3: ابزارک ها را در __init__بشر اگر به منطق شرطی (بر اساس کاربر یا برخی از پرچم های خارجی) نیاز دارید ، می توانید ویجت را پس از لحظه ای به روز کنید.

بیایید همه گزینه ها را در یک شکل به عنوان مثال مشاهده کنیم:

# forms.py

class ContactForm(forms.Form):
    subject = forms.CharField(
        max_length=100,
        # *** CUSTOMIZE WIDGET: option 1 ***
        widget=forms.TextInput(
            attrs={
                "class": "form-control",
                "placeholder": "Subject",
            }
        ),
    )
    message = forms.CharField(widget=forms.Textarea)
    sender = forms.EmailField()
    cc_myself = forms.BooleanField(required=False)

    # *** CUSTOMIZE WIDGET: option 2 ***
    message.widget.attrs.update(
        {"class": "form-control", "placeholder": "Write your message here"}
    )

    # *** CUSTOMIZE WIDGET: option 3 ***
    def __init__(self, *args, user=None, **kwargs):
        super().__init__(*args, **kwargs)
        self.fields["sender"].widget.attrs["class"] = "form-control"

        # Conditional logic based on user
        if user and user.is_authenticated:
            self.fields["sender"].initial = user.email
        else:
            print(user)
            self.fields["sender"].widget.attrs["readonly"] = True
            self.fields["sender"].widget.attrs[
                "placeholder"
            ] = "Login to fill your email"
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

کاربر هنگام فوری فرم به نمای منتقل می شود:

#views.py

def form3(request):
    if request.method == "POST":
        form = ContactForm(request.POST)
        if form.is_valid():
            context = {"form": form}
            messages.success(request, "Your message has been sent!")
            return redirect("form")
    else:
        form = ContactForm(user=request.user)
    context = {"form": form}
    return render(request, "form.html", context=context)
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

2. سفارشی سازی ابزارک ها در فرم های مدل (forms.ModelForm)

ما این فرم و مدل را داریم.


#forms.py
class PostForm(ModelForm):
    class Meta:
        model = Post
        fields = "__all__"


# models.py
class Post(models.Model):
    title = models.CharField()
    title_tag = models.CharField()
    body = models.TextField()
    user = models.ForeignKey(User, on_delete=models.CASCADE)
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

می توانید ویجت را مانند این سفارشی کنید:

گزینه ها:

  • گزینه 1: مزارع را به صورت دستی نادیده بگیرید
  • گزینه 2: از ویجت های داخل کلاس متا استفاده کنید
  • گزینه 3: ابزارک ها را در __init__بشر اگر به منطق شرطی (بر اساس کاربر یا برخی از پرچم های خارجی) نیاز دارید ، می توانید ویجت را پس از لحظه ای به روز کنید.

بیایید همه گزینه ها را در یک شکل به عنوان مثال مشاهده کنیم:


class PostForm(ModelForm):
    # *** CUSTOMIZE WIDGET: option 1 ***
    title = forms.CharField(
        widget=forms.TextInput(
            attrs={"class": "form-control", "placeholder": "Here goes the title"}
        )
    )

    class Meta:
        model = Post
        fields = "__all__"
        # *** CUSTOMIZE WIDGET: option 2 ***
        widgets = {
            "body": forms.Textarea(attrs={"class": "form-control", "rows": 5}),
        }

    # *** CUSTOMIZE WIDGET: option 3 ***
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.fields["title_tag"].widget.attrs.update(
            {"class": "form-control", "placeholder": "Title tag"}
        )

حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

اکنون شما می توانید ابزارک های پروژه خود را سفارشی کنید!

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا