zoukankan      html  css  js  c++  java
  • 表单渲染方式

    以登录页面为例get方式渲染一个form表单

    post方式提交数据

    自定义

    def login(reqeust):
     
        if reqeust.method=="POST":
           username =reqeust.POST.get('username')
           print(username,'u')
           password=reqeust.POST.get('password')
           print(password,'p'*120)
           user=UserInfo.objects.filter(username=username,password=password)
           if user:
               reqeust.session['user']=username
               return HttpResponse('欢迎登录系统')
           else:
               return HttpResponse('用户名或密码错误')
    
        return render(reqeust,'login.html',locals())
    view视图
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.css">
        <script src="/static/jquery-3.2.1.min.js"></script>
        <script src="/static/bootstrap/js/bootstrap.js"></script>
        <script src="/static/init_ajax.js"></script>
    
        <style>
            form {
                margin-top: 100px;
            }
    
    
            .btn {
                display: block;
                margin-left: auto;
                margin-right: auto;
            }
        </style>
    </head>
    <body>
    <div class=""></div>
    <div class="container">
        <div class="row">
            <div class="col-md-4 col-md-offset-4">
                <form action="/login/" class="center-block" method="post">
                    {% csrf_token %}
                    <div class="form-group">
                        <label for="username_id"></label>
                        用户名:<input type="text" class="form-control" id="username_id" name="username">
                    </div>
    
                    <div class="form-group">
                        <label for="password_id"></label>
                        密码 :<input type="password" class="form-control" id="password_id" name="password">
                    </div>
    
                    <div class="form-group">
                        <input type="submit" class="btn btn-primary" value="登录">
                    </div>
                </form>
            </div>
        </div>
    </div>
    
    
    </body>
    </html>
    login页面

    form组件

    注意:get方式不用form组件渲染可以,但是需要name值与form组件的类字段相同

    from django.shortcuts import render,HttpResponse
    from django import forms
    from django.forms import widgets
    from app01.models import *
    
    # Create your views here.
    
    class Myform(forms.Form):
        username= forms.CharField(max_length=12,
                                  min_length=6,
                                  label='用户名',
                                  widget=widgets.TextInput(attrs={'class':"form-control", 'id':'user'})
                                  )
        pwd=forms.CharField(
            min_length=6,
            max_length=12,
            label='密码',
            widget=widgets.PasswordInput(
                attrs={'class':'form-control','id':'pwd'}
            )
        )
    
        gender = forms.ChoiceField(
            # choices=((1基础, "男"), (2, "女"), (3, "保密")),
            choices=Sex.objects.all().values_list('id','sex'),
            label="性别",
            initial=3,
            widget=forms.widgets.RadioSelect
        )
    
        # def __init__(self, *args, **kwargs):
        #     super(Myform,self).__init__(*args,**kwargs)
        # Account.objects.all().values('id',)
    
    
    def reg(request):
        error_msg = ""
        form_obj = Myform()
        if request.method == "POST":
            form_obj = Myform(request.POST)
            if form_obj.is_valid():
                username = form_obj.cleaned_data.get("username")
                # print('username',username)
                pwd = form_obj.cleaned_data.get("pwd")
                # print('pwd',pwd)
                gender =form_obj.cleaned_data.get('gender')
                # print('gender',gender)
                Account.objects.create(name=username,pwd=pwd,Tosex_id=gender)
                return HttpResponse('注册成功')
        return render(request, "reg_test.html", {"form_obj": form_obj, "error_msg": error_msg})
    views.py
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="x-ua-compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.css">
    
        <title>login</title>
        <style>
            .error {
                color: red;
            }
    
            #center {
                height: 200px;
                position: absolute;
                margin-top: -150px;
                top: 50%;
    
            }
        </style>
    
    </head>
    <body>
    
    
    <div class="container">
        <div class="row">
            <div class="col-md-4 col-md-offset-2" id="center">
                <form action="" method="post" novalidate>
                    {% csrf_token %}
                    <div class="form-group">
    
                        <label for="{{ form_obj.username.id_for_label }}" class=" control-label">
                            {{ form_obj.username.label }}
                        </label>
                        <div>
                            {{ form_obj.username }}
                            <span class="help-block">{{ form_obj.username.errors.0 }}</span>
                        </div>
                    </div>
    
                    <div class="form-group">
                        <label for="{{ form_obj.pwd.id_for_label }}" class="control-label">{{ form_obj.pwd.label }}</label>
                        <div>{{ form_obj.pwd }}</div>
                        <span class="error">{{ form_obj.pwd.errors.0 }}</span>
                    </div>
    
    
                    <div class="form-group">
                        <label for="{{ form_obj.gender.id_for_label }}"
                               class="control-label">{{ form_obj.gender.label }}</label>
                        <div>{{ form_obj.gender }}</div>
    
                        <span class="error">{{ form_obj.pwd.errors.0 }}</span>
                    </div>
    
                    <div class="form-group  col-lg-offset-4">
                        <input type="submit" class="btn btn-primary">
                        <span class="error">{{ error_msg }}</span>
                    </div>
    
                </form>
    
                <script src="/static/jquery-3.2.1.min.js"></script>
                <script src="/static/bootstrap/js/bootstrap.js"></script>
                <script src="/static/init_ajax.js"></script>
                <script>
                    $(this)
                </script>
    
            </div>
        </div>
    </div>
    
    </body>
    </html>
    form组件(get渲染)

    ModelForm

    from django.shortcuts import render,HttpResponse,redirect
    
    # Create your views here.
    from django.forms import ModelForm
    from app01.models import *
    from django.forms import widgets as wg
    
    class Bookform(ModelForm):
        class Meta:
            model=Book
            fields='__all__'
            widgets={
               'title':wg.TextInput(attrs={'class':'form-control'}),
               'price':wg.TextInput(attrs={'class':'form-control'}),
               'publisher':wg.Select(attrs={'class':'form-control'}),
               'authors':wg.SelectMultiple(attrs={'class':'form-control'})
           }
    
    
    
    
    class login_form(ModelForm):
        class Meta:
            model = UserInfo
            fields = '__all__'
            labels={
                'username':'用户名',
                'password':'密码'
            }
    
    
    def login(request):
        if request.method=="POST":
            username=request.POST.get('username')
            password=request.POST.get('password')
            user=UserInfo.objects.filter(username=username,password=password)
            if user:
                return redirect('/index/')
    
        form_login=login_form()
        return render(request,'login.html',locals())
    
    
    
    
    
    
    def book_list(request):
        book_list=Book.objects.all().values('id','title','price','publisher__name','authors__name')
        # book_list=Book.objects.all()
        # authors = Author.objects.all()
        # print(book_list)
        # book_list(zzzzz)=Book.objects.all()
        
        return render(request,'book_list.html',locals())
    
    
    
    def add(request):
        if request.method=='POST':
            form_post=Bookform(request.POST)
            if form_post.is_valid():
                form_post.save()
            return redirect('/login/')
        forms=Bookform()
        return render(request, 'add.html', locals())
    
    def  delete(request,id):
        Book.objects.filter(pk=id).delete()
        return redirect('/book_list/')
    
    def edit(request,id):
        edit_book = Book.objects.filter(pk=id).first()
    
        if request.method=='POST':
            form=Bookform(request.POST,instance=edit_book)
            if form.is_valid():
                form.save()
    
    
    
    
        formbook=Bookform(instance=edit_book)
        return render(request,'edit.html',locals())
    views.py
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.css">
        <style>
            form{
                margin-top: 100px;
            }
        </style>
    </head>
    <body>
    
    <script src="/static/jquery-3.2.1.min.js"></script>
    <script src="/static/bootstrap/js/bootstrap.js"></script>
    <script src="/static/init_ajax.js"></script>
    
    <div class="container">
        <div class="row">
            <div class="col-md-4 col-md-offset-4">
                <form action="" method="post">
                    {% csrf_token %}
                    <div class="form-group">
                        <label for=""></label>
                        {{ form_login.username }}
    
                    </div>
    
                    <div class="form-group">
                        <label for=""></label>
                        {{ form_login.password }}
    
                    </div>
    
                    <input type="submit" class="btn btn-primary">
                </form>
            </div>
        </div>
    </div>
    </body>
    </html>
    html
  • 相关阅读:
    交互原型设计软件axure rp学习之路(一)
    charles关于手机APP抓包
    Charles常见问题汇总
    转: Charles 从入门到精通
    深度理解《正则表达式》
    monkey无规则压力测试
    go语言几个最快最好运用最广的web框架比较
    html 生成印章
    通过URI协议实现浏览器调用手机app
    基于GitLab+Jenkins的DevOps赋能实践
  • 原文地址:https://www.cnblogs.com/wanghuaqiang/p/8987204.html
Copyright © 2011-2022 走看看