zoukankan      html  css  js  c++  java
  • popup功能

    urls:

    #!/usr/bin/env python3
    # -*- coding: utf-8 -*-
    from django.conf.urls import url
    from chapter01 import views
    
    urlpatterns=[
        url('popupp',views.popparent),
        url('popupr',views.realpopup,name="addgoup"),
        url('double',views.doublepopup,name="doublepopup"),
    ]
    

    views

    from django.shortcuts import render
    from django.shortcuts import HttpResponse
    from chapter01 import models
    # Create your views here.
    
    
    def popparent(request):
    
        usergroup_list=models.UserGroup.objects.all()
    
        return render(request, 'chapter01/usergroup_list.html', {'usergroup_list':usergroup_list})
    
    
    def realpopup(request):
        if request.method=="GET":
            return render(request,'chapter01/add_usergroup.html')
        else:
            popupid=request.GET.get("popup")
            if popupid:
                title=request.POST.get("title")
                obj=models.UserGroup.objects.create(title=title)
                response={'data_dict':{'pk':obj.pk,'text':str(obj),'popid':popupid}}
    
                """
                1.关闭popup页面
                2.将新增数据添加,传送到到原来发送pop页面的 popid=ugID
                """
    
                return render(request,'chapter01/popup_response.html',response)
            else:
                title=request.POST.get("title")
                models.UserGroup.objects.create(title=title)
                return HttpResponse("重定向列表页面")
    
    
    
    def doublepopup(request):
        if request.method=="GET":
            return render(request,'chapter01/doublekill.html')
    
    
    add_usergroup.html
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>popuptest</title>
    </head>
    <body>
    <form method="POST">
        {% csrf_token %}
        <input type="text" name="title"/>
        <input type="submit" value="提交">
    </form>
        <a href="#" onclick="popupUrl('/chapter01/double/')">多级弹出</a>
    
    <script>
        function popupUrl(url) {
            window.open(url,'x2','status=1,300px,heigh:200px,toolbar=0,resizeable=1')
        }
    
        function f1() {
            alert(1111)
        }
    </script>
    </body>
    </html>
    

      



    usergroup_list.html
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>usergroup</title>
    </head>
    <body>
    <p>用户名:<input type="text"></p>
    
    <p>用户组:
        <select id="ugID">
        {% for i in usergroup_list %}
            <option value="{{ i.pk }}">{{ i.title }}</option>
    {% endfor %}
    </select>
    <a  onclick="popupUrl('/chapter01/popupr/?popup=ugID')">添加</a>
    </p>
    <script>
        /*
        *'xxxxx'是弹窗的别名,在出来的弹窗是将不是这个别名 而是会替换这个名字
        * */
        function popupUrl(url) {
            window.open(url,'xxxxx','status=1,height:400,400,toolbar=0,resizeable=0')
        }
        
        function popupCallBack1(data_dict) {
            var tag=document.createElement("option");
            tag.innerHTML=data_dict.text;
            tag.setAttribute('value',data_dict.pk);
            tag.setAttribute('selected','selected');
    
            document.getElementById(data_dict.popid).appendChild(tag)
        }
        
        function popupCallBack2() {
            
        }
    </script>
    
    </body>
    </html>
    

      

    popup_response.html
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>正在关闭的页面</title>
    </head>
    <body>
    <script>
        /*
        opener谁发起的代指谁
         */
        var data_dict={{ data_dict|safe }};
        opener.popupCallBack1(data_dict);
        window.close();
    
    </script>
    
    </body>
    </html>
    doublekill.html

      

    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    doublekilled
    </body>
    </html>
    

      

  • 相关阅读:
    分区表的一些操作例子
    MySQL 主从复制
    使用pipeline的函数
    主键字段使用不同数据类型的简单比较
    Flashback Query笔记
    基于Liquibase的数据库持续集成
    MySQL安装
    格式化SYS_GUID()成为标准格式
    Silverlight Treeview 相关操作:加载,保存,索引节点,节点移动,模板节点
    Silverlight TreeView组件的研究[2]
  • 原文地址:https://www.cnblogs.com/morgana/p/8586998.html
Copyright © 2011-2022 走看看