-
-
Save shubham-dota/d77ce889cc65e3ddbc7ee236c2976d17 to your computer and use it in GitHub Desktop.
FORMS AND USER INPUT [FLASK]
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {% extends "layout.html" %} | |
| {% block content %} | |
| <h1>About Page</h1> | |
| {% endblock content %} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| from flask import Flask, render_template, url_for, flash, redirect | |
| from forms import RegistrationForm, LoginForm | |
| app = Flask(__name__) | |
| @app.route("/") | |
| @app.route("/home") | |
| def home(): | |
| return render_template('home.html') | |
| @app.route("/about") | |
| def about(): | |
| return render_template('about.html', title='About') | |
| @app.route("/register") | |
| def register(): | |
| form = RegistrationForm() | |
| if form.validate_on_submit(): | |
| flash(f'Account created for {form.username.data}!', 'success') | |
| return redirect(url_for('home')) | |
| return render_template('register.html', title='Register', form=form) | |
| @app.route("/login") | |
| def login(): | |
| form = LoginForm() | |
| if form.validate_on_submit(): | |
| if form.email.data == 'admin@blog.com' and form.password.data == 'password': | |
| flash('You have been logged in!', 'success') | |
| return redirect(url_for('home')) | |
| else: | |
| flash('Login Unsuccessful. Please check username and password', 'danger') | |
| return render_template('login.html', title='Login', form=form) | |
| if __name__ == '__main__': | |
| app.run(debug=True) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| from flask_wtf import FlaskForm | |
| from wtforms import StringField, PasswordField, SubmitField, BooleanField | |
| from wtforms.validators import DataRequired, Length, Email, EqualTo | |
| class RegistrationForm(FlaskForm): | |
| username = StringField('Username', | |
| validators=[DataRequired(), Length(min=2, max=20)]) | |
| email = StringField('Email', | |
| validators=[DataRequired(), Email()]) | |
| password = PasswordField('Password', validators=[DataRequired()]) | |
| confirm_password = PasswordField('Confirm Password', | |
| validators=[DataRequired(), EqualTo('password')]) | |
| submit = SubmitField('Sign Up') | |
| class LoginForm(FlaskForm): | |
| email = StringField('Email', | |
| validators=[DataRequired(), Email()]) | |
| password = PasswordField('Password', validators=[DataRequired()]) | |
| remember = BooleanField('Remember Me') | |
| submit = SubmitField('Login') |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {% extends "layout.html" %} | |
| {% block content %} | |
| {% for post in posts %} | |
| <article class="media content-section"> | |
| <div class="media-body"> | |
| <div class="article-metadata"> | |
| <a class="mr-2" href="#">{{ post.author }}</a> | |
| <small class="text-muted">{{ post.date_posted }}</small> | |
| </div> | |
| <h2><a class="article-title" href="#">{{ post.title }}</a></h2> | |
| <p class="article-content">{{ post.content }}</p> | |
| </div> | |
| </article> | |
| {% endfor %} | |
| {% endblock content %} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <!-- Required meta tags --> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | |
| <!-- Bootstrap CSS --> | |
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> | |
| <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='main.css') }}"> | |
| {% if title %} | |
| <title>Flask Blog - {{ title }}</title> | |
| {% else %} | |
| <title>Flask Blog</title> | |
| {% endif %} | |
| </head> | |
| <body> | |
| <header class="site-header"> | |
| <nav class="navbar navbar-expand-md navbar-dark bg-steel fixed-top"> | |
| <div class="container"> | |
| <a class="navbar-brand mr-4" href="/">Flask Blog</a> | |
| <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarToggle" aria-controls="navbarToggle" aria-expanded="false" aria-label="Toggle navigation"> | |
| <span class="navbar-toggler-icon"></span> | |
| </button> | |
| <div class="collapse navbar-collapse" id="navbarToggle"> | |
| <div class="navbar-nav mr-auto"> | |
| <a class="nav-item nav-link" href="{{ url_for('home') }}">Home</a> | |
| <a class="nav-item nav-link" href="{{ url_for('about') }}">About</a> | |
| </div> | |
| <!-- Navbar Right Side --> | |
| <div class="navbar-nav"> | |
| <a class="nav-item nav-link" href="{{ url_for('login') }}">Login</a> | |
| <a class="nav-item nav-link" href="{{ url_for('register') }}">Register</a> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| </header> | |
| <main role="main" class="container"> | |
| <div class="row"> | |
| <div class="col-md-8"> | |
| {% with messages = get_flashed_messages(with_categories=true) %} | |
| {% if messages %} | |
| {% for category, message in messages %} | |
| <div class="alert alert-{{ category }}"> | |
| {{ message }} | |
| </div> | |
| {% endfor %} | |
| {% endif %} | |
| {% endwith %} | |
| {% block content %}{% endblock %} | |
| </div> | |
| <div class="col-md-4"> | |
| <div class="content-section"> | |
| <h3>Our Sidebar</h3> | |
| <p class='text-muted'>You can put any information here you'd like. | |
| <ul class="list-group"> | |
| <li class="list-group-item list-group-item-light">Latest Posts</li> | |
| <li class="list-group-item list-group-item-light">Announcements</li> | |
| <li class="list-group-item list-group-item-light">Calendars</li> | |
| <li class="list-group-item list-group-item-light">etc</li> | |
| </ul> | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </main> | |
| <!-- Optional JavaScript --> | |
| <!-- jQuery first, then Popper.js, then Bootstrap JS --> | |
| <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> | |
| <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {% extends "layout.html" %} | |
| {% block content %} | |
| <div class="content-section"> | |
| <form method="POST" action=""> | |
| {{ form.hidden_tag() }} | |
| <fieldset class="form-group"> | |
| <legend class="border-bottom mb-4">Log In</legend> | |
| <div class="form-group"> | |
| {{ form.email.label(class="form-control-label") }} | |
| {% if form.email.errors %} | |
| {{ form.email(class="form-control form-control-lg is-invalid") }} | |
| <div class="invalid-feedback"> | |
| {% for error in form.email.errors %} | |
| <span>{{ error }}</span> | |
| {% endfor %} | |
| </div> | |
| {% else %} | |
| {{ form.email(class="form-control form-control-lg") }} | |
| {% endif %} | |
| </div> | |
| <div class="form-group"> | |
| {{ form.password.label(class="form-control-label") }} | |
| {% if form.password.errors %} | |
| {{ form.password(class="form-control form-control-lg is-invalid") }} | |
| <div class="invalid-feedback"> | |
| {% for error in form.password.errors %} | |
| <span>{{ error }}</span> | |
| {% endfor %} | |
| </div> | |
| {% else %} | |
| {{ form.password(class="form-control form-control-lg") }} | |
| {% endif %} | |
| </div> | |
| <div class="form-check"> | |
| {{ form.remember(class="form-check-input") }} | |
| {{ form.remember.label(class="form-check-label") }} | |
| </div> | |
| </fieldset> | |
| <div class="form-group"> | |
| {{ form.submit(class="btn btn-outline-info") }} | |
| </div> | |
| <small class="text-muted ml-2"> | |
| <a href="#">Forgot Password?</a> | |
| </small> | |
| </form> | |
| </div> | |
| <div class="border-top pt-3"> | |
| <small class="text-muted"> | |
| Need An Account? <a class="ml-2" href="{{ url_for('register') }}">Sign Up Now</a> | |
| </small> | |
| </div> | |
| {% endblock content %} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {% extends "layout.html" %} | |
| {% block content %} | |
| <div class="content-section"> | |
| <form method="POST" action=""> | |
| {{ form.hidden_tag() }} | |
| <fieldset class="form-group"> | |
| <legend class="border-bottom mb-4">Join Today</legend> | |
| <div class="form-group"> | |
| {{ form.username.label(class="form-control-label") }} | |
| {% if form.username.errors %} | |
| {{ form.username(class="form-control form-control-lg is-invalid") }} | |
| <div class="invalid-feedback"> | |
| {% for error in form.username.errors %} | |
| <span>{{ error }}</span> | |
| {% endfor %} | |
| </div> | |
| {% else %} | |
| {{ form.username(class="form-control form-control-lg") }} | |
| {% endif %} | |
| </div> | |
| <div class="form-group"> | |
| {{ form.email.label(class="form-control-label") }} | |
| {% if form.email.errors %} | |
| {{ form.email(class="form-control form-control-lg is-invalid") }} | |
| <div class="invalid-feedback"> | |
| {% for error in form.email.errors %} | |
| <span>{{ error }}</span> | |
| {% endfor %} | |
| </div> | |
| {% else %} | |
| {{ form.email(class="form-control form-control-lg") }} | |
| {% endif %} | |
| </div> | |
| <div class="form-group"> | |
| {{ form.password.label(class="form-control-label") }} | |
| {% if form.password.errors %} | |
| {{ form.password(class="form-control form-control-lg is-invalid") }} | |
| <div class="invalid-feedback"> | |
| {% for error in form.password.errors %} | |
| <span>{{ error }}</span> | |
| {% endfor %} | |
| </div> | |
| {% else %} | |
| {{ form.password(class="form-control form-control-lg") }} | |
| {% endif %} | |
| </div> | |
| <div class="form-group"> | |
| {{ form.confirm_password.label(class="form-control-label") }} | |
| {% if form.confirm_password.errors %} | |
| {{ form.confirm_password(class="form-control form-control-lg is-invalid") }} | |
| <div class="invalid-feedback"> | |
| {% for error in form.confirm_password.errors %} | |
| <span>{{ error }}</span> | |
| {% endfor %} | |
| </div> | |
| {% else %} | |
| {{ form.confirm_password(class="form-control form-control-lg") }} | |
| {% endif %} | |
| </div> | |
| </fieldset> | |
| <div class="form-group"> | |
| {{ form.submit(class="btn btn-outline-info") }} | |
| </div> | |
| </form> | |
| </div> | |
| <div class="border-top pt-3"> | |
| <small class="text-muted"> | |
| Already Have An Account? <a class="ml-2" href="{{ url_for('login') }}">Sign In</a> | |
| </small> | |
| </div> | |
| {% endblock content %} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment