Skip to content

Registration Form Web App #1097

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 9 commits into from
Oct 5, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
23 changes: 23 additions & 0 deletions GUIScripts/Registration Form Web App/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
## Overview:
With the help of the PyWebIO module, we'll create a registration form. This Python library is mostly used to build simple, interactive web interfaces locally. Username, name, password, email, and website link information will be entered into this form. In relation to passwords, it will also double-check your password to see whether it is accurate. Your phone number, website URL, and email address will also be verified.

## Form Elements
* input_group: Used to get the inputs in the group.
* input: Used to take all kinds of inputs from the user.
* type: This depends on user choice whether the user wants a number in the input or a text in the input.
* required: If required is true, that means you have to input something, we can’t leave blank.
* validate: Receives input as a parameter, when the input value is valid, it returns True.
* cancelable: Whether the form can be canceled. Default is False.
* PlaceHolder: This element is used only in the input_group function.
* radio: Only a single can be selected.
* select: You can also select multiple options by setting the “multiple” parameter to True.

## Working
This form will take your username, name, password, email, and website link as input. Speaking of passwords, it will also check your password again to confirm whether it is correct or not. It will also validate your phone number, website link, and email address.

After that, you will get the radio button consisting of gender, and you will also get the comment section so that you can write your feedback. As you can see in the below image, first we have to pass the username, then we will pass the password, and then to check whether the password is correct or not, we will confirm it by reentering the new password. The name, phone number, and phone number will then be verified to see if they are valid.

When we pass the email, it will be verified using the re-module. Finally, pass the website link, so that we can access that site. And when we press the reset button, the whole content will refresh. When we press the submit button, it will be submitted and will show you the whole content.

## Output:
<img width=50% src="../Registration Form Web App/Images/form.jpg">
103 changes: 103 additions & 0 deletions GUIScripts/Registration Form Web App/form.py
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
from pywebio.input import *
from pywebio.output import *
from pywebio.session import *
import re

# For checking Email, whether Valid or not.
regex = '^(\w|\.|\_|\-)+[@](\w|\_|\-|\.)+[.]\w{2,3}$'

# For checking Phone Number, whether Valid or
# not.
Pattern = re.compile("(0/91)?[6-9][0-9]{9}")

# For Checking URL, whether valid or not
regex_1 = ("((http|https)://)(www.)?" +
"[a-zA-Z0-9@:%._\\+~#?&//=]" +
"{2,256}\\.[a-z]" +
"{2,6}\\b([-a-zA-Z0-9@:%" +
"._\\+~#?&//=]*)")
Pattern_1 = re.compile(regex_1)


def check_form(data):

# for checking Name
if data['name'].isdigit():
return ('name', 'Invalid name!')

# for checking UserName
if data['username'].isdigit():
return ('username', 'Invalid username!')

# for checking Age
if data['age'] <= 0:
return ('age', 'Invalid age!')

# for checking Email
if not (re.search(regex, data['email'])):
return ('email', 'Invalid email!')

# for checking Phone Number
if not (Pattern.match(str(data['phone']))) or len(str(data['phone'])) != 10:
return ('phone', 'Invalid phone!')

# for checking Website URL
if not re.search(Pattern_1, data['website']):
return ('website', 'Invalid URL!')

# for matching Passwords
if data['pass'] != data['passes']:
return ('passes', "Please make sure your passwords match")


# Taking input from the user
data = input_group("Fill out the form:", [
input('Username', name='username', type=TEXT,
required=True, PlaceHolder="@username"),

input('Password', name='pass', type=PASSWORD,
required=True, PlaceHolder="Password"),

input('Confirm Password', name='passes', type=PASSWORD,
required=True, PlaceHolder="Confirm Password"),

input('Name', name='name', type=TEXT, required=True,
PlaceHolder="name"),

input('Phone', name='phone', type=NUMBER,
required=True, PlaceHolder="12345"),

input('Email', name='email', type=TEXT,
required=True, PlaceHolder="[email protected]"),

input('Age', name='age', type=NUMBER, required=True,
PlaceHolder="age"),

input('Portfolio website', name='website', type=TEXT,
required=True, PlaceHolder="www.XYZ.com")

], validate=check_form, cancelable=True)

# Create a radio button
gender = radio("Gender", options=['Male', 'Female'], required=True)

# Create a skills markdown
skills = select("Tech Stack", options=[
'C Programming', 'Python', 'Web Development', 'Android Development'],
required=True)

# Create a textarea
text = textarea("Comments/Questions", rows=3,
placeholder="Write something...", required=True)

# Create a checkbox
agree = checkbox("Agreement", options=[
'I agree to terms and conditions'], required=True)

# Display output using popup
popup("Your Details",
f"Username: @{data['username']}\nName: {data['name']}\
\nPhone: {str(data['phone'])}\nEmail: {data['email']}\
\nAge: {str(data['age'])}\nWebsite: {data['website']}\
\nGender: {gender}\nSkill: {skills}\nComments: {text}",
closable=True)
1 change: 1 addition & 0 deletions GUIScripts/Registration Form Web App/requirement.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
pip install pywebio