"Enter"a basıp içeriğe geçin

Flask – WTForms ile Form İşlemleri ve Validation

WTForm (WTF), form elemanlarını sunucu tarafında oluşturmamızı sağlayan, bunların kontrolünü kolaylaştıran ve güvenliğini sağlayan bir kütüphane olarak karşımıza çıkıyor. Flask-WTF ise WTForms kütüphanesini Flask ile daha rahat kullanabilmemiz için geliştirilmiş bir ara kütüphanedir diyebiliriz.

Kurulum

Öncelikle projemize kütüphanemizi eklememiz gerekiyor.

~$ pip install flask-wtf

Sanal ortamda çalışmanız önerilir =)

Bu komut flask-wtf ile beraber wtforms kütüphanesini de kuracaktır. Kurulum başarılı ise artık çalışmaya başlayabiliriz.

Temel Yapı

Öncelikle çalışma dizinine forms.py isminde bir dosya oluşturuyoruz. Her form için bir sınıf tanımlayacağız.

from flask_wtf import FlaskForm
from wtforms import StringField, TextAreaField, SubmitField
from wtforms.validators import DataRequired

class ContactForm(FlaskForm):
    name = StringField('Your Name', validators = [DataRequired()])
    message = TextAreaField('Your Message', validators = [DataRequired()])
    submit = SubmitField('Send')

Kullanılacak her form elemanının karşılığı ve bu elemanların kontrolleri aşağıda ki tabloda verilmiştir.

Oluşturduğumuz form ana projemize dahil edilir ve rotalama işlemi ile beraber template içine gönderilir.

from flask import Flask, render_template
from forms import ContactForm

app = Flask(__name__)
app.config['SECRET_KEY'] = 'MySecretKey'

@app.route('/')
def index():
    form = ContactForm()
    return render_template('index.html', form = form)


if __name__ == '__main__':
    app.run(port = 1337, debug = True)

Geriye sadece bunu tasarım içerisinde göstermek kalıyor.

<!DOCTYPE html>
<html lang="tr" dir="ltr">
    <head>
        <meta charset="utf-8">
        <title>İletişim</title>
    </head>
    <body>
        <form action="" method="post">
            {{ form.hidden_tag() }}
            
            {{ form.name.label() }} <br>
            {{ form.name() }} <br>

            {{ form.message.label() }} <br>
            {{ form.message() }} <br>

            {{ form.submit.label() }} <br>
            {{ form.submit() }} <br>
        </form>
    </body>
</html>

Görüldüğü gibi oldukça basit. Ha bu arada hidden_tag() CSRF için bir token oluşturuyor. Güvenlik için yani. Parantez içerisinde ise elemana özel class vs gönderebilirsiniz.

Form Elemanları

NesnelerAçıklaması
StringField()<input type=”text”> ögesini temsil eder.
PasswordField()<input type=”password”> ögesini temsil eder.
TextAreaField()<textarea> ögesini temsil eder
BooleanField()<input type=”checkbox”> ögesini temsil eder.
RadioField()<input type=”radio”> ögesini temsil eder.
SelectField()<select> ögesini temsil eder.
SubmitField()<input type=”submit”> ögesini temsil eder.

Validatörler

ValidatörAçıklama
DataRequired()Alanın boş olup olmadığını denetler.
Email()E-Mail olup olmadığını kontrol eder.
IPAddress()IP adresi olup olmadığını kontrol eder.
Length(min = 5, max = 50)Karakter aralığını kontrol eder.
EqualTo(‘password’)Bir başka alan ile aynı olmasını kontrol eder.

Çok daha fazlasına aşağıda ki link üzerinden ulaşabilirsiniz: WTForms Fields

Eğer autofocus, placeholder gibi argümanları da göndermek isterseniz bunu render_kw ile gönderebilirsiniz.

username = StringField('Username',
    validators = [DataRequired()],
    render_kw = {'autofocus': True, 'placeholder': 'Kullanıcı Adı'})

Küçük Bir Örnek

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField, IntegerField
from wtforms.validators import DataRequired, Length, Email, EqualTo

class RegisterForm(FlaskForm):
    name = StringField('Your Name',
                        validators = [
                            DataRequired(),
                            Length(min = 5, max = 20, message = "Bu alan 5 ila 20 karakter arasında olmalıdır.")],
                        render_kw = {'autofocus': True, 'placeholder': 'Kullanıcı Adı'})
    mail = StringField('Your Email',
                        validators = [
                            DataRequired(), Email()],
                        render_kw = {'placeholder': 'Kullanıcı Mail'})
    password = PasswordField('Your Password',
                            validators = [DataRequired()],
                            render_kw = {'placeholder': 'Kullanıcı Şifre'})
    confirmPassword = PasswordField('Your Confirm Password',
                                    validators = [DataRequired(), EqualTo('password')],
                                    render_kw = {'placeholder': 'Şifre Tekrar'})
    submit = SubmitField('Register')

class LoginForm(FlaskForm):
    mail = StringField('Your Mail', validators = [DataRequired(), Email()])
    password = PasswordField('Your Password', validators = [DataRequired()])
    submit = SubmitField('Login')

Hataları yakalamak isterseniz eğer template kısmında şu kodları kullanabilirsiniz.

{% for field in form.errors %}
            {% for error in form.errors[field] %}
                <div class="alert alert-error">
                    <strong>Error!</strong> {{error}}
                </div>
            {% endfor %}
        {% endfor %}

Farklı Hata Mesajları Fırlatmak

def validate_username(self, username):
        user = User.query.filter_by(username = username.data).first()
        if user:
            raise ValidationError('This username is taken')

Daha Fazlası: https://flask-wtf.readthedocs.io/en/stable/

İlk Yorum Sizden Gelsin

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.