我是靠谱客的博主 淡淡诺言,最近开发中收集的这篇文章主要介绍Python-Django 项目模块-年级模块开发-修改(九)Python-django 自定义模块开发前言一、创建静态页面-年级修改页面二、后端代码编写,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

Python-django 自定义模块开发

第四章 Django 自定义模块-年级模块年纪信息修改


前言

 本系列文章以一个简单的学校项目来做演示,项目中遇到的问题会一一记录下来,仅供学习参考使用

此处学习版本 python3.8 django 4.0.6 bootstrap3 开发工具 VSCODE


一、创建静态页面-年级修改页面

{% load i18n static %}
<!DOCTYPE html>
<html>

<head>
    <title>年级管理-修改</title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <!-- 静态地址引入方式-->
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="{% static 'bootstrap-3.4.1/css/bootstrap.min.css' %}" />
    <!-- 程序引入方式 -->
    <!-- 可选的 Bootstrap 主题文件(一般不用引入) -->
    <link rel="stylesheet" href="{% static 'bootstrap-3.4.1/css/bootstrap-theme.min.css' %}" />
    <script src="{% static 'js/jquery-3.2.1/jquery.min.js' %}"></script>
    <script src="{% static 'js/popper-1.15.0/umd/popper.min.js' %}"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="{% static 'bootstrap-3.4.1/js/bootstrap.min.js' %}"></script>
    <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询(media queries)功能 -->
    <!-- 警告:通过 file:// 协议(就是直接将 html 页面拖拽到浏览器中)访问页面时 Respond.js 不起作用 -->
    <!-- HTML5 Shiv 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
    <!--[if lt IE 9]>
         <script src="/static/js/html5shiv-3.7.0/html5shiv.js"></script>
         <script src="/static/js/respond-1.4.2/respond.min.js"></script>
      <![endif]-->

    <style type="text/css">


    </style>
</head>

<body>
    <div class="container-fluid">
        <!-- Stack the columns on mobile by making one full-width and the other half-width -->
        <div class="row">
            <!-- 导航栏固定在顶部-->
            <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
                <div class="container-fluid">
                    <!-- 左侧 -->
                    <div class="navbar-header">
                        <!--图标 -->
                        <a class="navbar-brand" href="#" style="padding-top:5px;">
                            <img alt="Brand" src="{% static 'images/ico.png' %}" />
                        </a>
                        <a class="navbar-brand" href="#">陕西家里蹲大学师生信息管理系统</a>
                    </div>
                    <!-- 中间菜单 -->
                    <div>
                        <ul class="nav navbar-nav" id="ul_menu_top">
                            <li><a href="{% url 'school_web_grade:gradeIndex' pageIndex=1 %}">年级管理</a></li>
                            <li><a href="#">学科管理</a></li>
                            <li><a href="#">老师管理</a></li>
                            <li><a href="#">班级管理</a></li>
                            <li><a href="#">学生管理</a></li>
                        </ul>
                    </div>
                    <!-- 右侧 -->
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="#"><span class="glyphicon glyphicon-user"></span> 注册</a></li>
                        <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> 登录</a></li>
                        <li>
                            <a href="javascript:void(0)" onclick="openModalWindow()"><span
                                    class="glyphicon glyphicon-off"></span> 退出</a>
                        </li>
                    </ul>
                </div>
            </nav>

        </div>
        <!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop -->
        <div class="row" style="padding-top: 50px;padding-bottom: 50px;">
            <!-- 中间内容区域 -->
            <div class="panel panel-info ">
                <div class="panel-heading"><span class="glyphicon glyphicon-pencil"></span>年级管理-修改数据</div>
                <div class="panel-body">
                    {% block content %}
                    <form class="form-horizontal" id="gradeForm" name="gradeForm"
                        action="{% url 'school_web_grade:saveGradeEdit' schoolGrade.grade_id %}" method="post">
                        {% csrf_token %}
                        <div class="form-group">
                            <label for="grade_name" class="col-sm-2 control-label">年级名称:</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" name="grade_name" id="grade_name"
                                    placeholder="请输入年级名称" value="{{ schoolGrade.grade_name }}" />
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-offset-2 col-sm-10">
                                <button type="submit" class="btn btn-success">保&nbsp;存</button>
                            </div>
                        </div>
                    </form>
                    <div class="row" >
                        <div class="col-md-6 col-md-offset-3">
                            <!-- 消息框 成功 -->
                            {% if result == 1  %}
                            <div class="alert alert-success alert-dismissible" role="alert" >
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                                <strong>提示:</strong> 修改成功!
                            </div>
                            {% elif result <= 0 %}
                            <div class="alert alert-danger alert-dismissible" role="alert" >
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                                <strong>提示:</strong> 修改失败!
                            </div>
                            {% endif %}
                        </div>
                    </div>
                    
                    {% endblock %}
                </div>
            </div>

        </div>
        <div class="row navbar navbar-default navbar-fixed-bottom" style="text-align: center; height: 40px;">
            <div class="bg-success" style="height: 100% ;padding-top: 15px;">
                版权所有@copyRight 2013-2022 口袋里的小龙 开发框架 python3.8 bootstrap-3 Django4
            </div>
        </div>
        
        
       
    </div>
    <script type="text/javascript">
        $(document).ready(function () {
            // 在这里写你的代码...
            $('#showDetail').modal('hide')
            //菜单点击事件
            $("#ul_menu_top li").click(function () {
                //清除样式
                $("#ul_menu_top li").removeClass("active");
                //设置选中颜色
                $(this).addClass("active");
                console.log($(this));
            });

            // hide 方法调用之后立即触发该事件。
            $('#modalWindowDiv').on('hidden.bs.modal', function (e) {
                // do something...
                console.log("hide 方法调用之后立即触发该事件。");
            });
            //从远端的数据源加载完数据之后触发该事件
            $('#modalWindowDiv').on('loaded.bs.modal', function (e) {
                // do something...
                console.log("从远端的数据源加载完数据之后触发该事件");
            });
            //show 方法调用之后立即触发该事件。如果是通过点击某个作为触发器的元素,则此元素可以通过事件的 relatedTarget 属性进行访问。
            $('#modalWindowDiv').on('show.bs.modal', function (e) {
                // do something...
                console.log("show 方法调用之后立即触发该事件");
            });
            //此事件在模态框已经显示出来(并且同时在 CSS 过渡效果完成)之后被触发。如果是通过点击某个作为触发器的元素,则此元素可以通过事件的 relatedTarget 属性进行访问。
            $('#modalWindowDiv').on('shown.bs.modal', function (e) {
                // do something...
                console.log("此事件在模态框已经显示出来(并且同时在 CSS 过渡效果完成)之后被触发");
            });

        });

        /**
         * 模态窗口打开的方法
         */
        function openModalWindow() {
            //打开模态窗口的方法 手动打开模态框。在模态框显示之前返回到主调函数中 
            $('#modalWindowDiv').modal('show');

            //手动隐藏模态框。在模态框隐藏之前返回到主调函数中 
            // $('#modalWindowDiv').modal('hide')
        }

    </script>
</body>

</html>

 在年级主页【修改】按钮中增加访问url

 <button type="button" class="btn btn-warning btn-xs" data-url="{% url 'school_web_grade:loadGradeEdit' grade.grade_id %}" onclick="editGrade(this)" >
                                            <span class="glyphicon glyphicon-pencil"></span>修改
                                        </button>

对应的方法

 //修改
        function editGrade(_this) {
            console.log($(_this).attr("data-url"));
            var url = $(_this).attr("data-url");
            window.open(url);
        }

二、后端代码编写

views.py 

## 修改
def loadGradeEdit(request,grade_id):
    schoolGrade = SchoolGrade.objects.get(grade_id=grade_id)
    context = {"schoolGrade":schoolGrade}
    return render(request=request,template_name="grade/grade_edit.html",context=context)

## 修改保存数据
def saveGradeEdit(request,grade_id):
    ## 如果 get() 没有找到任何对象,它会引发一个 Model.DoesNotExist 异常: 多个数据  Model.MultipleObjectsReturned 异常
     schoolGrade = SchoolGrade.objects.get(grade_id=grade_id)
     ## 定义修改状态
     result = -1
     ## 判断是否为post请求
     if request.method == "POST":
        ## 获取数据的方法
        grade_name = request.POST.get("grade_name")
        ## 修改时间
        grade_update_date = datetime.datetime.now()
        result = SchoolGrade.objects.filter(grade_id=grade_id).update(grade_name=grade_name,grade_update_date=grade_update_date)
        print("数据修改结果:",result)
        if result > 0:
            schoolGrade.grade_name = grade_name
            context = {"schoolGrade":schoolGrade,"result":result}
        return render(request=request,template_name="grade/grade_edit.html",context=context)
     context = {"schoolGrade":schoolGrade,"result":result}
     return render(request=request,template_name="grade/grade_edit.html",context=context)

urls.py 

  ## 修改界面
    path(route="loadGradeEdit/<int:grade_id>/",view=views.loadGradeEdit,name="loadGradeEdit"),
    ## 保存修改内容
    path(route="saveGradeEdit/<int:grade_id>/",view=views.saveGradeEdit,name="saveGradeEdit"),

运行效果

最后

以上就是淡淡诺言为你收集整理的Python-Django 项目模块-年级模块开发-修改(九)Python-django 自定义模块开发前言一、创建静态页面-年级修改页面二、后端代码编写的全部内容,希望文章能够帮你解决Python-Django 项目模块-年级模块开发-修改(九)Python-django 自定义模块开发前言一、创建静态页面-年级修改页面二、后端代码编写所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(42)

评论列表共有 0 条评论

立即
投稿
返回
顶部