Neste artigo, vamos criar um formulário de registro usando o módulo PyWebIO. Este é um módulo Python usado principalmente para criar interfaces simples e interativas na web local usando Programação Python. 

Este formulário terá nome de usuário, nome, senha, e-mail, link do site como entrada. Por falar em senhas, ele também verificará sua senha novamente para confirmar se sua senha está correta ou não. Ele também validará seu número de telefone, link do site, endereço de e-mail. Depois disso, você obterá o botão de opção que consiste em Gênero e também a seção de comentários para que possa escrever seus comentários.

Elementos do Formulário 

Para criar um formulário adequado com validações, aprenderemos diferentes elementos de formulário, um por um, com exemplos.

1. input_group: Este elemento é usado para obter as entradas no grupo. Quando usamos input_group , precisamos fornecer o parâmetro de nome para cada função de entrada para identificar os itens de entrada no resultado.

Sintaxe: input_group (“Title”, [input ('Any name', name = 'Anything'), input ('Any name', name = 'Anything')])



info = input_group("Group inputs", [
     input('Username', name='username'),
     input('Password', name='pass')])

Saída: 

2. input: este elemento é usado para obter todos os tipos de entradas do usuário do navegador.

Sintaxe: input ('Algum texto')

input("Your name")

Saída: 

3. tipo: é definido dentro da função de entrada ou função input_group . Isso depende da escolha do usuário se o usuário deseja um número na entrada ou um texto na entrada. Se o tipo for igual ao número, ele só aceitará números e um caso semelhante para o texto.

Sintaxe: 

entrada ('Algum texto', digite = TEXTO)

entrada ('Algum texto', digite = NUMBER)

entrada ('Algum texto', digite = SENHA)

input('Name', type=TEXT)
input('PIN', type=NUMBER)
input('Password', type=PASSWORD)

Saída: 

4. obrigatório: Se obrigatório for verdadeiro, isso significa que você deve inserir algo, não podemos deixar em branco, caso contrário, ocorrerá um erro chamado “Por favor, preencha este campo”. Por padrão, é falso.

Sintaxe: input ('Algum texto', obrigatório = Verdadeiro)



input('Name', required=True)

Saída: 

5. validar: Este elemento recebe a entrada como parâmetro, quando o valor da entrada é válido retorna True, quando a entrada do usuário é inválida retorna uma mensagem de erro.

Sintaxe: input ('Some text', validate = is_valid)

def is_valid(data):
    if data <= 0:
        return 'Age cannot be negative!'
  
input('Age', type=NUMBER, validate=is_valid)

Saída: 

6. cancelável: se o formulário pode ser cancelado. O padrão é False. Se cancelável = True, um botão “Cancelar” será exibido na parte inferior do formulário.

Sintaxe: input_group (“Title”, [input ('Any name', name = 'Anything'), input ('Any name', name = 'Anything')], cancelable = True)



input_group("Info", [input('Name', name='name'),input('PIN ', name='pin')], cancelable=True)

Saída: 

7. PlaceHolder: Este elemento é usado apenas na função input_group, isso é usado para mostrar um texto muito claro.

Sintaxe: input ('Algum texto', espaço reservado = ”algum texto”)

input('Name', placeholder="Please Enter your name")

Saída: 

8. rádio: O botão de rádio é usado quando temos que escolher apenas uma opção entre as várias opções, ou seja, apenas uma pode ser selecionada.

Sintaxe: rádio (“Algum texto”, opções = ['Opção 1', 'Opção 2'])



radio("Gender", options=['Male', 'Female'])

Saída: 

9. selecionar:   Isso também é chamado de seleção suspensa. Por padrão, apenas uma opção pode ser selecionada por vez. Você também pode selecionar várias opções definindo o parâmetro “múltiplo” como Verdadeiro.

Sintaxe: select (“Algum texto”, opções = ['Opção 1', 'Opção 2', 'Opção 3', 'Opção 4'], múltiplo = Verdadeiro)

select("Tech Stack", options=[
  'C Programming', 'Python', 'Web Development', 'Android Development'])

Saída: 

10. textarea: Este elemento é usado para fazer a entrada de várias linhas em uma área de entrada de texto. A linha é um elemento definido dentro da área de texto , que é usado para um certo número de linhas de texto visíveis.

Sintaxe: textarea (“Algum texto”, linhas = 3)



textarea("Comments/Questions", rows=3)

Saída: 

11. caixa de seleção: A caixa de seleção permite aos usuários selecionar / desmarcar vários valores, temos que fornecer as opções para que o usuário possa selecionar quaisquer valores.

Sintaxe: caixa de seleção (“Algum texto”, opções = ['Opção 1', 'Opção 2', 'Opção 3']) 

checkbox("Languages", options=['Hindi', 'English', 'French'])

Saída: 

12. pop-up: o pop é usado para produzir saída em forma de pop-up, vários pops-ups não podem ser exibidos ao mesmo tempo. Antes de exibir uma nova janela pop-up, o pop-up existente na página será fechado automaticamente ou você pode fechar manualmente.

Sintaxe: pop - up (“Título”, “Texto”)



popup("Who are you?", "Geeks for Geeks")

Saída: 

Formulário Completo

# Import following modules
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="user@gmail.com"),
    
    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)

Saída: 

 Atenção geek! Fortaleça suas bases com o Python Programming Foundation Course e aprenda o básico.