मटीरियल डिज़ाइन एक डिज़ाइन टेम्प्लेट है जो डेवलपर्स के बीच बहुत लोकप्रिय है। इसका उपयोग फ्रंटएंड पर सीडीएन के रूप में किया जाता है। इस लेख में, हम यह देखने जा रहे हैं कि हमारे फॉर्म विजेट्स पर सामग्री डिजाइन का उपयोग कैसे करें और उस फॉर्म को हमारे विचारों से प्रस्तुत करें।
Django- सामग्री एक पुस्तकालय है जो सीडीएन के बिना प्रदान की गई HTML फ़ाइल या प्रपत्र विजेट पर सामग्री डिज़ाइन लागू करेगा।
सबसे पहले, django-सामग्री स्थापित करें पैकेज।
pip install django-material
सेटअप प्रोजेक्ट और ऐप और यूआरएल।
settings.py . में -
INSTALLED_APPS+=['material']
मेरे ऐप का नाम "myapp" . है ।
उदाहरण
models.py . में -
from django.db import models # Create your models here. class Data(models.Model): Name=models.CharField(max_length=100) salary = models.CharField(max_length=20)
यहां, हमने एक साधारण Django मॉडल बनाया है जिसे हम रूपों में उपयोग करेंगे।
urls.py . में -
from django.urls import path
from . import views
urlpatterns = [
path('', views.home,name="home"),
] यहां, हमने अपने विचार को होम url में प्रस्तुत किया है।
view.py . में -
from django.shortcuts import render
from django import forms
from .models import Data
class SalaryForm(forms.ModelForm):
class Meta:
model=Data
fields="__all__"
def home(request):
if request.method=='POST':
form=SalaryForm(request.POST)
if form.is_valid():
form.save()
else:
form=SalaryForm()
return render(request,'home.html',{'form':form}) यहां हमने एक फॉर्म बनाया और इसे फ्रंटएंड पर प्रस्तुत किया।
टेम्पलेट . बनाना न भूलें फ़ोल्डर और home.html इसमें।
home.html . में -
{% include 'material/includes/material_css.html' %} #These
two include
{% include 'material/includes/material_js.html' %} # will
import material design
<!DOCTYPE html>
<html>
<head>
<title>
TUT
</title>
<style>
</style>
</head>
<body>
<h2>FORM</h2>
<form action="/" method="post">
{% csrf_token %}
{{ form }}
<input type="submit" value="Submit">
</form>
</body>
यहां, हमने फ्रंटएंड बनाया और हमारे Django सामग्री के CSS और JS को लोड किया और यह स्वचालित रूप से हमारे फॉर्म पर डिज़ाइन जोड़ देगा।
आउटपुट
आप