django Layui界面点击弹出对话框并请求逻辑生成分页的动态表格实例

1、首先，界面上有个按钮触发操作：

用户列表

2、点击这个按钮触发之后，会弹出一个对话框并请求view，从数据库中得到数据并产生动态表格，

其中script代码如下：

3、接着，所请求的view的方法，即为上面定义的url属性，{% url 'user:user_list' %}，其中url配置，以及逻辑实现代码分别如下：

from django.urls import path
 
urlpatterns = [
 # 查询用户列表
 path('user_list/', UserQuery.as_view(), name="user_list"),
]

from apps.user.models.user_model import UserInfo
from django.http import JsonResponse
from django.views.decorators.csrf import csrf_exempt
 
class UserQuery(View):
 """
 用户信息查询
 """
 def post(self, request):
  user_list = UserInfo.objects.objects.get_queryset().order_by('id')
  data = dict()
  data_items = []
  for item in user_list :
   user_dict = {"username": item.username, "age": item.age, "sex": item.sex, "mobile": item.mobile,
       "address": item.address}
   data_items.append(user_dict )
  data.__setitem__("data", data_items)
  data.__setitem__("code", 0)
  data.__setitem__("msg", "")
  data.__setitem__("count", len(field_list))
  return JsonResponse(data)
 
 @csrf_exempt
 def dispatch(self, *args, **kwargs):
  return super(UserQuery, self).dispatch(*args, **kwargs)

注：

（1）、通过查询UserInfo model底下的数据，然后分别循环这个列表，把动态表格所需要显示的值，填充到一个字典底下，并追加进列表当中，最后再统一构成一个字典data，把列表数据，状态码，返回信息，数量返回回去。

（2）其中通过ajax请求时，可能会有csrf跨域的限制，因为我们没有构造一个表单，并在表单底下加个 {% csrf_token %} ，导致请求不过去，所以要加个@csrf_exempt注解方式来解决。

补充知识：django数据接口与layUI框架数据表格结合：数据渲染和真实分页

第一步 ：

通过查询数据转化为layui的数据接口模式

{“code”: 0, “msg”: “”, “count”:总数, “data”: 查询的数据}

自行定义访问路径，当url访问 xxxx/tasks/data/ 路径时：访问视图response_data，将数据传到前端，通过html可查看相关代码

视图函数views.py

import json
def response_data(request):
 dates=AssetInfo.objects.all()#自行创建测试数据。
 dataCount = dates.count()#数据总数
 lis=[]
 for i in dates:
  dict={}
  dict['jobname']=i.jobname#与前端一一对应，自行设置要展示的字段
  dict['Departments'] = i.Departments.lm_unit#外键字段
  dict['groups'] = i.groups.variables_name#外键字段
  dict['email'] = i.email
  dict['status'] = i.status
  dict['taskNo'] = i.taskNo
  dict['create_time'] = i.create_time
  lis.append(dict)
 pageIndex = request.GET.get('page') #前台传的值，
 pageSize = request.GET.get('limit') #前台传的值
 pageInator = Paginator(lis, pageSize)#导入分页模块分页操作，不写前端只展示一页数据，
 contacts = pageInator.page(pageIndex)#导入分页模块分页操作，不写前端只展示一页数据，
 res=[]
 for i in contacts:
  res.append(i)
 print(res)
 Result = {"code": 0, "msg": "", "count":dataCount, "data": res}
 # json.dumps(Result, cls=DateEncoder)没有时间字段问题可直接返回此代码。有就返回下面代码
 return HttpResponse(json.dumps(Result, cls=DateEncoder), content_type="application/json")

#解决时间字段json问题
class DateEncoder(json.JSONEncoder):
 def default(self, obj):
  if isinstance(obj,datetime.datetime):
   return obj.strftime("%Y-%m-%d %H:%M:%S")
  else:
   return json.JSONEncoder.default(self,obj)

html代码

效果图

以上这篇django Layui界面点击弹出对话框并请求逻辑生成分页的动态表格实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。