Merge pull request #1097 from Iamtripathisatyam/main

Registration Form Web App

Author: prathimacode-hub

GUIScripts/Registration Form Web App/Images/form.jpg

@@ -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">

GUIScripts/Registration Form Web App/README.md

@@ -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)

GUIScripts/Registration Form Web App/form.py

@@ -0,0 +1 @@
+pip install pywebio