VS2019 开发Django（十一）------表单

2019-10-01 23:55:19 阅读：229 来源： 互联网

标签：category form VS2019 url request 表单 let Django id

关于Django，我本人也是初次接触，就当作是一个学习笔记，有理解不到位或者错误的地方，欢迎指正~

Django官方文档：https://docs.djangoproject.com/zh-hans/2.1/

Visual Studio 中的Django Web框架：https://docs.microsoft.com/zh-cn/visualstudio/python/learn-django-in-visual-studio-step-01-project-and-solution?view=vs-2019

今天是中华人民共和国成立70周年的日子，普天同庆，看阅兵看得满腔热血，热泪盈眶，祖国都这么优秀了，我要更加努力才行啊！

这个Django系列的文章，没有很深入的研究，仅仅只是个入门笔记吧！做Web开发，Java，.Net Core都已经很牛逼了，Python在Web方面其实并没有什么优势，因为Python是脚本语言，执行效率肯定不如编译语言，这是毋庸置疑的，所以呢？学习Python的话，最终肯定要往爬虫，自动化运维，数据挖掘，人工智能方向继续努力......因为这才是Python的真正优势，也是这个时代炙手可热的技能。

那么，言归正传，继续今天的主题内容，表单，做一个简单的增删改。

1）删除。通过Ajax发送请求实现无刷新删除。

let category = JSON.stringify($bttable_category.bootstrapTable('getSelections'));获取选中行的数据，序列化成JSON之后得到选中的Category_Id

var url = "{% url 'category_delete' category_id=0 %}" 在Ajax中发送请求需要使用的Url需要传递一个参数，但是这个参数是改变的，而渲染路径的时候就需要这个ID，否则执行会报错，因为如果不给这个参数的话，Django框架会找不到这个Url

url = url.replace('0', category_id);所以在每次发送请求之前，需要使用真实id替换

着色部分的代码，是从数据库中删除成功之后，从界面上移除刚才删除的行

$btbtn_category_delete.click(function () {
            let category = JSON.stringify($bttable_category.bootstrapTable('getSelections'));
            let json = JSON.parse(category);
            if (json.length==0) {
                $('#myModal').modal('show');
            }
            else {
                let url = "{% url 'category_delete' category_id=0 %}"
                let category_id = json[0].category_id;
                url = url.replace('0', category_id);
                console.log(url)
                $.ajax({
                    url: url, //请求的url地址
                    dataType: "json", //返回格式为json
                    async: true,//请求是否异步，默认为异步，这也是ajax重要特性
                    //data: { "category_id": category_id }, //参数值
                    type: "GET", //请求方式
                    beforeSend: function () {
                        //请求前的处理
                    },
                    success: function (req) {
                        //请求成功时处理
                        //alert(req.message);
                        var ids = $.map($bttable_category.bootstrapTable('getSelections'), function (row) {
                            return row.category_id
                        })
                        $bttable_category.bootstrapTable('remove', {
                            field: 'category_id',
                            values: ids
                        })
                    },
                    complete: function () {
                        //请求完成的处理
                    },
                    error: function (req) {
                        //请求出错处理
                        console.log(req);
                    }
                });
            }
        })

def category_delete(request,category_id):
    Category.objects.get(pk=category_id).delete()
    return JsonResponse({'code':0,'message':'ok'})

2）新增和修改。其实也很简单，引入的新的知识点就是表单Form

新建文件forms.py，然后粘贴下面的代码，在表单中我们可以控制具体的数据类型渲染成什么html标签，还可以通过widget指定CSS样式等，针对模型的表单，更多知识点参考官方文档

from django.forms import ModelForm
from hello.models import Category

class EditCategoryForm(ModelForm):
    category_name = forms.CharField(label='类别名:',max_length=10,widget=forms.TextInput({
                                   'class': 'form-control',
                                   'placeholder': '类别名'}))
    class Meta:
        model = Category
        #fields = ['category_name']
        fields = '__all__'

views.py中增加函数category_add

def category_add(request):
    if request.method == 'GET':
        form = EditCategoryForm()
        context={'form':form}
        return render(request,'hello/category_add.cshtml',context)
    else:
        form = EditCategoryForm(request.POST)
        if form.is_valid():
            form.save()
        return JsonResponse({'code':0,'message':'ok'})

新增加category_add.cshtml文件，粘贴如下代码

{% extends "hello/layout.cshtml" %}

{% block content %}

    <form action="{% url 'category_add' category_id %}" method="post">
        {% csrf_token %}
        <div class="form-group">
            {{ form }}
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
    </form>

{% endblock %}

渲染出来的效果如下图：

3）修改。其实修改只是在增加的基础上变动了一点点，就是跳转的时候，要传入需要修改的那个类别的参数，然后把它显示出来

$btbtn_category_edit.click(function () {
    let category = JSON.stringify($bttable_category.bootstrapTable('getSelections'));
    let json = JSON.parse(category);
    if (json.length == 0) {
        $('#myModal').modal('show');
    }
    else {
        let urlEdit = "{% url 'category_edit' category_id=0 %}"
        let category_id = json[0].category_id;
        urlEdit = urlEdit.replace('0', category_id);
        self.location = urlEdit;
    }

})

def category_edit(request,category_id):
    category = get_object_or_404(Category, pk=category_id)
    if request.method == 'GET':
        form = EditCategoryForm(instance=category)
        context = {'form':form,'category_id':category.category_id}
        return render(request,'hello/category_detail.cshtml',context)
    elif request.method == 'POST':
        form = EditCategoryForm(request.POST)
        if form.is_valid():
            category.category_name = form.data['category_name']
            category.save()
        #category.category_name = request.POST['category_name']
        #category.save()
        return JsonResponse({'code':0,'message':'ok'})

标签：category,form,VS2019,url,request,表单,let,Django,id
来源： https://www.cnblogs.com/dwBurning/p/Django11.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

VS2019 开发Django（十一）------表单