1. 程式人生 > >stark元件之pop頁面,按鈕,url,頁面

stark元件之pop頁面,按鈕,url,頁面

 
  • 1、Window open() 方法
  • 2、admin的pop新增按鈕
  • 3、stark之pop功能
  •  3、知識點總結
  • 4、coding程式碼

1、Window open() 方法

 

效果圖

 

2、admin的pop新增按鈕

3、stark之pop功能

 

POP功能:   

  1.如何只有多對多和一對多欄位後面才渲染 "+"
  2."+"的對應的跳轉路徑
  3.儲存新增記錄的同時,應該將原頁面對應的下拉選單新增該記錄。

1、

 

2、多對多欄位如何渲染

 

3、isinstance判斷型別

4、  一對多或多對多欄位的關聯模型

 

 

 

5、bootstrap頁面自適應col-xs-8

 

 6、model表顯示的是__str__

 

7、構造url

 

 

8、傳遞資料,window.open使用

 

 

 3、知識點總結

1、pop功能:

  1.在一對多和多對多欄位後渲染 +
2.+對應的跳轉路徑
3.儲存新增記錄同時,將原頁面的對應的下拉選單中新增該記錄

2、在一對多和多對多欄位後渲染+   

 後臺需要先判斷 是否是 一對多 多對多欄位
modelform, 遍歷
for bfield in form:
print(bfield.field) # 是每個form欄位物件
所以:判斷是否是一對多,多對多欄位
if isinstance(bfield.field, ModelChoiceField):
bfield.is_pop = True # 為特殊欄位加上特有屬性,方便前端判斷。

注意:ModelMultipleChoiceField(多對多) 繼承 ModelChoiceField(一對多)
ModelChoiceField 繼承 ChoiceField

3、+對應的跳轉路徑

    form表單得一對多,多對多得欄位物件
bfield.field.queryset.model # 相關聯得模型!!<class 'app01.models.Publish'>
#(模型表得物件去找 filter_field_obj.rel.to.objects.all(),到to是模型。)

根據queryset找model queryset.model
根據model找queryset model.objects.all()

related_model_name = bfield.field.queryset.model._meta.model_name # publish
related_app_label = bfield.field.queryset.model._meta.app_label # app01

反向解析url
_url = reverse("%s_%s_add" % (related_app_label, related_model_name))

# 為bfield新增自己特有的url,
# ?後面是為了,區分是top,還是正常頁面開啟/add/,方便之後關閉,以及賦值。
bfield.url = _url + "?pop_res_id=id_%s" % bfield.name

4、關閉彈出得top頁面

    top彈出,關閉頁面,回到到原頁面;
正常新增,跳轉到list頁面;

返回 res = {"pk":obj.pk, 'text':str(obj), "pop_res_id": pop_res_id}
pop.html,方便關閉pop頁面

pop.html:
關閉以及將接收得資料傳到原頁面上!
window.opener.pop_response("{{ res.pk}}","{{ res.text }}","{{ res.pop_res_id }}");
window.close()

5、原頁面接收資料,並顯示剛新增得資料(window.opener)

    拿到 id, text, pop_res_id
動態建立 option append到對應得下拉框中,並選中;
var $option = $("<option>");
$option.html(text);
$option.val(pk);
$option.attr('selected','selected');

$('#'+pop_res_id).append($option)

 

6、前端展示:定位,(父相子絕)

     <div style="position: relative">
        {% if field.is_pop %}
            <a onclick="pop('{{ field.url }}')"><span style="font-size: 23px;position: absolute; right: -23px; top: 25px;">+</span></a>
        {% endif %}
     </div>

 

7、補充:

ChoiceFiled
ModelChoiceFiled(ChoiceFiled) ---- select(單選) --- ForeignKey
MultiModelChoiceFiled (ModelChoiceFiled)----select(多選) --- ManyToManyField

Book模型,form表單,modelform;
modelform幫我們轉成了form表單;

bootstrap頁面自適應: col-xs-8

程式碼註釋總結:

首先準備工作做完:
    window.opener.pop_response('{{ res.pk }}','{{ res.text }}','{{ res.pop_res_id }}');
    window.close()
在pop頁面關閉前把指定的值傳參給主頁面執行,然後執行一個close,關閉掉自己。

2.增加檢視函式

 # 增加資料檢視函式
    def add_view(self,request):
        ModelFormDemo=self.get_modelform_class()
        form = ModelFormDemo()
        #迴圈每個form欄位,看看他們的型別是不是一對多和對多型別,是的話需要前端新增+號
        for bfield in form:    迴圈ModelForm的每一個欄位,把多對多和一對多欄位篩選出來。
            print(bfield.field) #欄位物件
            print(bfield.name) #欄位名(字串)
            from django.forms.models import ModelChoiceField
            if isinstance(bfield.field,ModelChoiceField):
                bfield.is_pop=True           如果需要加+的話,那麼賦一個True的值。方便前端判定
                    【
                    {% if field.is_pop %}
                        <a onclick="pop('{{ field.url }}')" href="" style="position: absolute;right: -30px;top: 26px"><spanstyle="font-size: 26px">+</span></a>
                    {% endif %}
                    】

                #print(bfield.field.queryset.model)
    #這裡需要注意,pop出來頁面需要新增的表名和app名,和主頁面的新增是不一樣的。
 

注意:

 related_model_name=bfield.field.queryset.model._meta.model_name
 related_app_label=bfield.field.queryset.model._meta.app_label

  #通過一個方向解析拿到一個url.
  _url=reverse("%s_%s_add"%(related_app_label,related_model_name))

  #要知道的是,點的哪個加號,在URL後加一個這個欄位的名字,做一個記號。
  bfield.url=_url+"?pop_res_id=id_%s"%bfield.name

檢視函式中繼續:

        if request.method=="POST":
            form = ModelFormDemo(request.POST)
            if form.is_valid():
                obj=form.save()
                pop_res_id=request.GET.get("pop_res_id") #每一個modelform渲染到前端的id是id_+"欄位名"

                #<input type="text" name="title" maxlength="32" required="" id="id_title">
                

                if pop_res_id:
                    #如果能取到id的話,表示是pop頁面而不是主頁面的新增。
                    res={"pop_res_id":pop_res_id,"pk":obj.pk,"text":str(obj)}
                    #pop頁面新增成功以後,obj也就有了值,就是當前新增這條資料的各種值,
                    #取到id,新增的欄位,新增的內容給了前端模板。
                    return render(request,"pop.html",locals())
                else:
                    return redirect(self.get_list_url())

        return render(request,"add_view.html",locals())

 

前端模板拿到後端傳過來的url以後,渲染到+上。

    http://127.0.0.1:8000/stark/app01/publish/add/?pop_res_id=id_publish
    http://127.0.0.1:8000/stark/app01/author/add/?pop_res_id=id_authors
    點選不同的+,url也不同。pop_res_id也都不同。
    同時給+繫結一個彈框事件:
        function pop(url) {
        window.open(url,"","width=600,height=400,top=100,left=100")
    }
     開啟框以後,新增完畢點選提交後,

  window.opener.pop_response('{{ res.pk }}','{{ res.text }}','{{ res.pop_res_id }}');
  window.close()
  #把值取到並且把視窗關閉。

 

    最後就是

 function pop_response(pk,text,pop_res_id){
                var $option = $("<option>");          //建立一個標籤
                $option.html(text);                   //將新增的資料的文字值給了這個標籤內容
                $option.val(pk);                      //賦一個value值,值是這條記錄的PK
                $option.attr("selected","selected");  //預設為選中
                $("#"+pop_res_id).append($option)     //哪個標籤後新增的,就把這個option放到哪個標籤下。
            }
    #主新增頁面拿到關閉前通過引數傳過來的值以後,渲染出一個option標籤,把內容,和id,等全部寫好,最後加到指定的select標籤下面。

4、coding程式碼

1、starkadmin

from django.shortcuts import HttpResponse
from stark.service import stark
from .models import *
from django.forms import ModelForm

class AuthorConfig(stark.ModelStark):
    list_display = ['nid', 'name', 'age']
    list_display_links = ['name','age']


class BookModelForm(ModelForm):
    class Meta:
        model = Book
        fields = "__all__"

        labels = {
            "authors":"作者",
            "publishDate":"出版日期",
        }

class BookConfig(stark.ModelStark):
    # list_display = ['title', 'price','publish','authors']
    list_display = ['__str__',]
    list_display_links = ['title']
    modelform_class = BookModelForm
    search_fields = ['title','price']
    list_filter = ['title','publish','authors']  # 一對多,多對多欄位

    # 批量修改資料
    def patch_init(self,request,queryset):
        queryset.update(price=111)

        # return HttpResponse("批量初始化OK")

    patch_init.short_description = "批量初始化"

    actions = [patch_init]


stark.site.register(Book,BookConfig)
stark.site.register(Publish)
stark.site.register(Author,AuthorConfig)
stark.site.register(AuthorDetail)

# print(stark.site._registry)
View Code

 2、stark/service/stark.py

# -*- coding: utf-8 -*-
# @Time    : 2018/08/17 0017 14:46
# @Author  : Venicid
from django.conf.urls import url
from django.shortcuts import HttpResponse,render,redirect

from django.utils.safestring import mark_safe
from django.urls import reverse
from django.db.models import Q  # 與或非
from django.db.models.fields.related import ForeignKey
from django.db.models.fields.related import ManyToManyField
import copy

from stark.utils.page import Pagination
class ShowList(object):
    def __init__(self,config, data_list,request):
        self.config = config  # MOdelStark例項物件
        self.data_list = data_list      # 資料
        self.request =request

        # 分頁
        data_count = self.data_list.count()
        current_page = int(self.request.GET.get('page',1))
        base_path = self.request.path
        self.pagination = Pagination(current_page,data_count,base_path,self.request.GET,per_page_num=10, pager_count=11,)

        # 分頁後的資料
        self.page_data = self.data_list[self.pagination.start:self.pagination.end]

        # actions 批量初始化,欄位
        # self.actions = self.config.actions # [patch_init]
        self.actions = self.config.new_actions() # [pathch_delete,patch_init,]
        # 構建資料[{'name':'path_init',"desc":'xxxxx'}]

    # filter的tag如何生成的
    def get_filter_linktags(self):
        link_dic = {}
        for filter_field in self.config.list_filter:        # ['title','publish','authors']
            # 1.獲取url中的相關欄位,後面比較
            current_id = self.request.GET.get(filter_field,0)
            pararms = copy.deepcopy(self.request.GET)

            # 2 頁面生成  各種欄位
            filter_field_obj = self.config.model._meta.get_field(filter_field)
            print(filter_field_obj,type(filter_field_obj))
            # app01.Book.publish  < class 'django.db.models.fields.related.ForeignKey'>
            # app01.Book.authors < class 'django.db.models.fields.related.ManyToManyField'>

            # print('rel...',filter_field_obj.re)     # <ManyToOneRel: app01.book>
            # print('rel...',filter_field_obj.re.to.objects.all())  # <QuerySet [<Publish: 南京出版社>, <Publish: 北京出版社>]>

            # 解決步驟
            # print('rel...',filter_field_obj.__dict__)
            # print('rel...',filter_field_obj.remote_field)
            # print('rel...',filter_field_obj.remote_field.__dict__)
            # print("rel...", filter_field_obj.remote_field.model.objects.all())
            # <QuerySet [<Publish: 南京出版社>, <Publish: 北京出版社>]>
            # <QuerySet [<Author: jack>, <Author: tom>]>

            # 一對一欄位or一對多欄位
            if isinstance(filter_field_obj,ForeignKey) or isinstance(filter_field_obj,ManyToManyField):
                data_list = filter_field_obj.remote_field.model.objects.all()
            else:
                # 普通欄位
                data_list = self.config.model.objects.all().values('pk',filter_field)

            # 3、 生成標籤的href
            temp = []
            if pararms.get(filter_field):
                del pararms[filter_field]
                temp.append("<a href='?%s'>全部</a>"%pararms.urlencode())
            else:
                temp.append("<a href='#' class='active'>全部</a>")

            # 處理filter欄位的href
            for obj in data_list:
                # print(data_list)
                # 一對一,一對多欄位
                if isinstance(filter_field_obj, ForeignKey) or isinstance(filter_field_obj, ManyToManyField):
                    pk = obj.pk
                    text = str(obj)
                    pararms[filter_field] = pk
                else:
                    # 普通欄位
                    pk = obj.get('pk')
                    text = obj.get(filter_field)
                    pararms[filter_field] = text

                _url = pararms.urlencode()
                # print(type(current_id),type(pk),type(text))
                if str(current_id) == str(pk) or str(current_id) ==str(text):
                    link_tag = "<a href='?%s' class='active'>%s</a>"%(_url,text)
                else:
                    link_tag = "<a href='?%s'>%s</a>"%(_url,text)
                temp.append(link_tag)
            link_dic[filter_field] = temp

        return link_dic

    def get_action_list(self):
        """action批量初始化,構架資料"""
        temp = []
        for action in self.actions:
            temp.append(
                {'name':action.__name__,                # class的類名
                 "desc":action.short_description        # class的屬性
                 }
            )
        return temp

    def get_header(self):
        # 構建表頭
        header_list = []  # # header_list = ['選擇','pk',...'操作','操作']
        for field in self.config.new_list_play():
            if callable(field):
                # header_list.append(field.__name__)
                val = field(self.config, header=True)
                header_list.append(val)
            else:
                if field == "__str__":
                    header_list.append(self.config.model._meta.model_name.upper())
                else:
                    val = self.config.model._meta.get_field(field).verbose_name    # 中文名稱
                    header_list.append(val)

        return header_list

    def get_body(self):
        # 構建表單
        new_data_list = []
        for obj in self.page_data:    #分頁後的資料               # Book表模型,Author表模型
            temp = []
            for field in self.config.new_list_play():     #  ["__str__"]  ['name','age']
                if callable(field):                 # edit()  可呼叫的
                    val = field(self.config,obj)           # 直接呼叫edit()函式
                else:
                    try:
                        field_obj = self.config.model._meta.get_field(field)
                        if isinstance(field_obj,ManyToManyField):
                            ret = getattr(obj,field).all()       # 反射  obj是例項物件,name是方法
                            t = []
                            for obj in ret:
                                t.append(str(obj))
                            val = ','.join(t)

                        else:
                            val = getattr(obj, field)
                            # list_display_links 按鈕
                            if field in self.config.list_display_links:
                                _url = self.config.get_change_url(self,obj)
                                val = mark_safe("<a href='%s'>%s</a>"%(_url,val))

                    # __str__ 的步驟
                    except  Exception as e:
                        val = getattr(obj,field)                #  <bound method Book.__str__ of <Book: php>
                        _url = self.config.get_change_url(obj)   # /app01/book/3/change/
                        val = mark_safe("<a href='%s'> %s </a>" % (_url, val()))

                temp.append(val)

            new_data_list.append(temp)

        # print('new_data_list',new_data_list)        # 構造資料  [['jack', 44], ['mark', 33]]

        return new_data_list


class ModelStark(object):
    list_display = ['__str__',]  # 子類中沒有,直接用父類自己的
    list_display_links = []
    modelform_class = []
    search_fields = []  # 模糊查詢欄位
    actions = []
    list_filter = []        # 過濾欄位


    # 批量刪除
    def patch_delete(self,request,queryset):
        queryset.delete()

    patch_delete.short_description = "Delete selected "


    def __init__(self,model, site):
        self.model = model
        self.site = site

    # 增刪改查url
    def get_add_url(self):
        model_name = self.model._meta.model_name
        app_label = self.model._meta.app_label
        _url = reverse("%s_%s_add" %(app_label,model_name))
        return _url

    def get_list_url(self):
        model_name = self.model._meta.model_name
        app_label = self.model._meta.app_label
        _url = reverse("%s_%s_list" %(app_label,model_name))
        return _url

    def get_change_url(self,obj):
        model_name = self.model._meta.model_name
        app_label = self.model._meta.app_label
        _url = reverse("%s_%s_change" %(app_label,model_name),args=(obj.pk,))
        return _url

    # 複選框,編輯,刪除
    def checkbox(self,obj=None, header=False):
        if header:
            return mark_safe("<input id='choice' type='checkbox'>")
        return mark_safe("<input class='choice_item' type='checkbox' name='selected_pk' value='%s'>"%obj.pk)

    def edit(self,obj=None, header=False):
        if header:
            return "操作"
        # 方案1:固定url
        # return mark_safe("<a href=/stark/app01/userinfo/%s/change>編輯</a>")
        # 方案2:拼接url
        # return mark_safe("<a href='%s/change'>編輯</a>")

        # 方案3:反向解析
        model_name = self.model._meta.model_name
        app_label = self.model._meta.app_label
        _url = reverse("%s_%s_change"%(app_label,model_name),args=(obj.pk,))
        # print("_url",_url)
        return mark_safe("<a href='%s'>編輯</a>"%_url)

    def deletes(self,obj=None, header=False):
        if header:
            return "操作"
        model_name = self.model._meta.model_name
        app_label = self.model._meta.app_label
        _url = reverse("%s_%s_delete"%(app_label,model_name),args=(obj.pk,))
        return mark_safe("<a href='%s'>刪除</a>"%_url)



    # ModelForm元件渲染  list、增、刪、改頁面
    def get_modelform_class(self):
        """ModelForm元件"""
        if not self.modelform_class:
            from django.forms import ModelForm
            class ModelFormDemo(ModelForm):
                class Meta:
                    model = self.model
                    fields = "__all__"
            return ModelFormDemo
        else:
            return self.modelform_class

    def new_list_play(self):
        """構建 ['checkbox','pk', 'name', 'age', edit,'delete']"""
        temp = []
        temp.append(ModelStark.checkbox)
        temp.extend(self.list_display)
        if not self.list_display_links:
            temp.append(ModelStark.edit)
        temp.append(ModelStark.deletes)
        return temp

    # action = ['delete',...]
    def new_actions(self):
        temp = []
        temp.append(ModelStark.patch_delete)        # delete新增
        temp.extend(self.actions)   # 如果定義新的,就擴充套件到temp中
        return temp

    '''
    def list_view(self,request):
        ret1 = self.model.objects.filter(title__startswith='py')
        ret2 = self.model.objects.filter(price__in=[11,22,33,44,55])
        ret3 = self.model.objects.filter(price__range=[10,20])
        ret4 = self.model.objects.filter(title__contains='O')
        ret5 = self.model.objects.filter(title__icontains='O')
        return HttpResponse("過濾成功")
    '''

    def get_search_condition(self,request):
        """search模糊查詢"""
        key_word = request.GET.get("q",'')
        self.key_word = key_word

        search_connection = Q()
        if key_word:
            search_connection.connector = "or"
            for search_field in self.search_fields:
                search_connection.children.append((search_field+"__contains", key_word))

        return search_connection


    def get_filter_condition(self,request):
        """filter過濾處理"""
        filter_condition = Q()      # 並且
        for filter_field,val in request.GET.items():
            if filter_field in self.list_filter:        # list_filter = ['publish','authors']
                filter_condition.children.append((filter_field,val))
        return filter_condition


    def list_view(self, request):
        if request.method == 'POST':
            # print('post',request.POST)
            action = request.POST.get("action")                     # action': ['patch_init'],
            if action:
                selected_pk = request.POST.getlist('selected_pk')       # 'selected_pk': ['5']}>
                action_func = getattr(self,action)  # 反射查詢 action       # 取出例項方法

                queryset = self.model.objects.filter(pk__in=selected_pk)        # 查詢
                ret = action_func(request,queryset)    # 執行action()     # 執行例項方法()
                # return ret

        # 獲取search的Q物件
        search_connection = self.get_search_condition(request)

        # 獲取filter構建Q物件
        filter_condition = self.get_filter_condition(request)

        # 篩選獲取當前表所有資料
        # data_list = self.model.objects.all().filter(search_connection)
        data_list = self.model.objects.all().filter(search_connection).filter(filter_condition)

        #按照showlist展示頁面, 構建表頭,表單
        show_list = ShowList(self,data_list,request)  # self=ModelSTark例項物件

        # 構建一個檢視addurl
        add_url = self.get_add_url()
        return render(request,'list_view.html', locals())

    def add_view(self, request):
        ModelFormDemo=self.get_modelform_class()
        form = ModelFormDemo()

        # 列印form的每個欄位
        from django.forms.boundfield import BoundField
        from django.forms.models import ModelChoiceField
        from django.forms.models import ModelMultipleChoiceField

        for bfield in form:
            # print(type(bfield))  # <class 'django.forms.boundfield.BoundField'>
            # print('field',bfield.field)   # <django.forms.models.ModelChoiceField object at 0x000000F2C0DEDC50>
            # print('name',bfield.name)    # publish

            if isinstance(bfield.field,ModelChoiceField):
                bfield.is_pop = True
                # print(bfield.field.queryset.model)     # 一對多或多對多欄位的關聯模型
                # <class 'app01.models.Publish'>  <class 'app01.models.Author'>

                # print(bfield.field.queryset.model._meta)  # app01.author
                related_app_name = bfield.field.queryset.model._meta.app_label  # app01
                related_model_name = bfield.field.queryset.model._meta.model_name # author

                _url = reverse("%s_%s_add"%(related_app_name,related_model_name))
                bfield.url = _url+"?pop_res_id=id_%s"%bfield.name

        if request.method == "POST":
            form = ModelFormDemo(request.POST)
            if form.is_valid():
                obj = form.save()

                # window.open新增頁面 要返回的資料
                pop_res_id = request.GET.get('pop_res_id')
                if pop_res_id:
                    res = {"pk":obj.pk,'text':str(obj),'pop_res_id':pop_res_id}
                    return render(request,'pop_view.html',locals())
                else:
                    return redirect(self.get_list_url())

        return render(request, "add_view.html",locals())

    def delete_view(self, request, id):
        url = self.get_list_url()
        if request.method == "POST":
            self.model.objects.filter(pk=id).delete()
            return redirect(url)
        return render(request, "delete_view.html", locals())

    def change_view(self, request, id):
        edit_obj = self.model.objects.filter(pk=id).first()

        ModelFormDemo=self.get_modelform_class()
        form = ModelFormDemo(instance=edit_obj)
        if request.method == "POST":
            form = ModelFormDemo(request.POST,instance=edit_obj)
            if form.is_valid():
                form.save()
                return redirect(self.get_list_url())

        return render(request, "change_view.html",locals())


    #構造 add/delete/change
    def get_urls2(self):
        model_name = self.model._meta.model_name
        app_label = self.model._meta.app_label

        temp = []
        temp.append(url(r'^$', self.list_view, name='%s_%s_list'%(app_label,model_name)))
        temp.append(url(r'^add/', self.add_view, name='%s_%s_add'%(app_label,model_name)))
        temp.append(url(r'^(\d+)/delete/', self.delete_view, name='%s_%s_delete'%(app_label,model_name)))
        temp.append(url(r'^(\d+)/change/', self.change_view, name='%s_%s_change'%(app_label,model_name)))

        return temp

    @property
    def urls2(self):

        return self.get_urls2(), None, None


class StarkSite(object):
    """site單例類"""
    def __init__(self):
        self._registry = {}

    def register(self,model, stark_class=None):
        """註冊"""
        if not stark_class:
            stark_class = ModelStark

        self._registry[model] = stark_class(model,self)

    def get_urls(self):
        """構造一層urls app01/book"""
        temp = []
        for model, stark_class_obj in self._registry.items():
            # print(model, 'stark_clas_obj', stark_class_obj)  # 不同的model模型表
            """
             <class 'app01.models.UserInfo'> ----> <app01.starkadmin.UserConfig object at 0x00000072DDB65198>
             <class 'app01.models.Book'> ----> <stark.service.stark.ModelStark object at 0x00000072DDB65240>
             """

            app_label = model._meta.app_label     # app01
            model_name = model._meta.model_name   # book
            # temp.append(url(r'^%s/%s'%(app_label, model_name),([],None,None)))
            temp.append(url(r'^%s/%s/'%(app_label, model_name),stark_class_obj.urls2))
            """
               path('app01/userinfo/',UserConfig(Userinfo,site).urls2),
               path('app01/book/',ModelStark(Book,site).urls2),
            """


        return temp

    @property
    def urls(self):

        # return [],None,None
        return self.get_urls(),None,None

site = StarkSite()   # 單例物件
View Code

 3、list_View.html

{% extends 'base.html' %}

{% block title %}
    <title>list頁面</title>
{% endblock %}

{% block css %}
    <style type="text/css">
        .active {
            color: red !important;
        }

        .filter a {
            text-decoration: none;
            color: grey;
        }
    </style>
{% endblock %}
{% block content %}
    <div class="col-md-9">

        <a class="btn btn-primary" href="{{ add_url }}">新增資料</a>

        {% if show_list.config.search_fields %}
            <form action="" method="get">
                <input type="text" class="form-control" style="width: 30%;display: inline-block;margin-top: 8px"
                       name="q"
                       value="{{ show_list.config.key_word }}">
                <button class="btn btn-success">submit</button>
            </form>
        {% endif %}


        <form action="" method="post">
            {% csrf_token %}
            <select name="action" class="form-control"
                    style="display: inline-block;width: 200px;margin: 8px 8px 8px 0;height: 35px;vertical-align: -2px">
                <option value="">-------</option>
                {% for item in show_list.get_action_list %}
                    <option value="{{ item.name }}">{{ item.desc }}</option>
                {% endfor %}
            </select>
            <button type="submit" class="btn btn-primary">Go</button>


            <table class="table table-bordered table-striped">
                <tr>
                    {% for header in show_list.get_header %}
                        <th>{{ header }}</th>
                    {% endfor %}
                </tr>

                {% for data in show_list.get_body %}
                    <tr>
                        {% for item in data %}
                            <td>{{ item }}</td>
                        {% endfor %}

                    </tr>
                {% endfor %}
            </table>
        </form>

        <nav>
            <ul class="pagination">
                {{ show_list.pagination.page_html|safe }}
            </ul>
        </nav>
    </div>
    <div class="col-md-3">
        <div class="filter">
            {% for filter_field, linktags in show_list.get_filter_linktags.items %}

                <div class="well">
                    <p>{{ filter_field.upper }}</p>

                    {% for link in linktags %}
                        <p>{{ link|safe }}</p>
                    {% endfor %}

                </div>

            {% endfor %}

        </div>
    </div>
{% endblock %}




{% block javascript %}
    <script type="text/javascript">
        $('#choice').click(function () {
            if ($(this).prop('checked')) {   //物件自身屬性中是否具有指定的屬性
                $('.choice_item').prop("checked", true)
            } else {
                $('.choice_item').prop("checked", false)
            }
        })
    </script>
{% endblock %}
View Code

4、add_view.html

{% extends 'base.html' %}

{% block title %}
    <title>add頁面</title>
{% endblock %}


{% block css %}
    <style type="text/css">
        input, select {
            display: block;
            width: 100%;
            height: 34px;
            padding: 6px 12px;
            font-size: 14px;
            line-height: 1.42857143;
            color: #555;
            background-color: #fff;
            background-image: none;
            border: 1px solid #ccc;
            border-radius: 4px;
            -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
            -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
            -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
            transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        }

        .error {
            color: red;
        }
    </style>
{% endblock %}

{% block header %}
    <h3>add頁面</h3>
{% endblock %}

{% block content %}
    <div class="col-md-6 col-xs-8 col-md-offset-4">
        {% include 'form.html' %}
    </div>


{% endblock %}

{% block javascript %}
    <script type="text/javascript">
        //開啟open頁面
        function pop(url) {
            window.open(url, '', 'width=600,height=400,left=100,right=100')
        }
        //open頁面操作完成,返回資料
        function pop_response(pk,text,id) {
            //選擇哪一個select標籤
            // option的文字值與value值
            var $option =$('<option>');     //<option></option>
            $option.html(text);  //<option>南京出版社</option>
            $option.val(pk);       //<option val=111>南京出版社</option>
            $option.attr("selected","selected");       //<option val=111 selected>南京出版社</option>
            $('#'+id).append($option)
        }
    </script>
{% endblock %}
View Code

 5、form.html

<form action="" method="post" novalidate>
    {% for field in form %}
        {% csrf_token %}
        <div class="form-group" style="position:relative;">
            <label for="">{{ field.label }}</label>
            {{ field }}
            <span class="error pull-right">{{ field.errors.0 }}</span>
            {% if field.is_pop %}
                <a onclick="pop('{{ field.url }}')" href=""
                   style="font-size: 25px;position: absolute;top: 25px;right: -25px"><span>+</span></a>
            {% endif %}
        </div>
    {% endfor %}
    <br>
    <button class="btn btn-success pull-right">提交</button>
</form>
View Code

6、pop_view.html

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