1. 使用Django中自带的模板

   1. 前端通过form 表单向后端提交数据

      # /template/demo/demo.html
      
      {% if result == 1 %}
      
      	<p> 插入成功 </p>
      
      {% else if result==2 %}
      
      	<p>插入失败</p>
      
      {% endif %}
      
      <form class="layui-form" method="post" action="{% url 'demo:type_add' %}" enctype="multipart/form-data">
      
      	{% csrf_token %}
      
          <input type="text" name="type_name" required autocomplete="off" class="layui-input">
      
          <input type="text" name="type_sort" required autocomplete="off" class="layui-input">
      
          <input type="submit" value="提交">
      
      </form>
      

   2. 后端通过渲染函数传递数据给模板文件并渲染

      # /demo/url.py
      
      app_name = '[demo]'
      
      urlpatterns = [
      
      	url(r'^type_add/', views.type_add, name='type_add'),
      
      ]
      

      # /demo/views.py
      
      def type_add(request):
      
          # 类型名称
      
          type_name = request.POST['type_name']
      
          # 类型排序
      
          type_sort = request.POST['type_sort']
      
          # 数据库操作
      
          result = DemoType.objects.create(type_name=type_name,type_sort=type_sort)
      
          if result:
      
              return render(request, 'demo/demo.html', {'result':1})
      
          else:
      
              //return HttpResponse('插入失败！')
      
              return render(request, 'demo/demo.html', {'result':2})
      
      

2. 使用Ajax

   1. 前端通过Ajax向后端发送请求提交数据

   2. 后端返回响应

   3. 前端收到响应后通过js对页面上显示的东西进行修改

      代码1：

      # 前端
      
      function demo(demo_id) {
      
          $.ajax({
      
              url: 'url',
      
              type: 'POST',
      
              headers: {"X-CSRFToken":'{{ csrf_token  }}' },
      
              data: {demo_id: demo_id},
      
              dataType:'json',
      
              success: function (e) {
      
                 //通过e获取后端返回的数据并对页面上的显示的东西进行修改
      
              },
      
          })
      
      }
      
      # 后端
      
      #路由部分与上面所示的类似
      
      #views.py
      
      def demo(request):
      
      	//如果是get请求的话 demo_id = request.GET.get('demo_id',0)
      
          demo_id = request.POST.get('demo_id', 0)
      
          user_id = request.session.get('user_id', 0)
      
         	return_param = {}
      
          try:
      
          	 // 数据库操作
      
          	demo.objects.update_or_create(users_id=user_id, goods_id=goods_id, status=1)
      
              return_param['status'] = 200
      
              return_param['msg'] = 'success'
      
          except Exception as e:
      
              return_param['status'] = 500
      
              return_param['msg'] = 'fail'
      
          return HttpResponse(json.dumps(return_param))
      
      

      代码2：

      #前端
      
      function demo(demo_id) {
      
        $.ajax({
      
            url: 'url',
      
            type: 'POST',
      
            headers: {"X-CSRFToken":'{{ csrf_token  }}' },
      
            data: JSON.stringify(data),
      
            dataType:'json',
      
            success: function (e) {
      
            		//console.log(e)
      
      			//通过e获取后端返回的数据并对页面上的显示的东西进行修改
      
            },
      
        })
      
      }
      
      #后端
      
      # 定义一个统用的响应类，方便规范返回给前端东西的格式
      
      # 公共部分可以新建一个文件放在 和settings.py文件 同一个文件夹内
      
      SUCCESS_CODE, FAIL_CODE, PARMS_CODE = 200, 400, 404
      
      class BaseResponse:
      
          def __init__(self, **kwargs):
      
              self.status_code = kwargs.get('code',0)
      
              self.message = kwargs.get('msg','')
      
              self.data = kwargs.get('data',[])
      
      #路由部分与上面所示的类似
      
      # 后端的 views.py部分
      
      def demo(request):
      
      	//如果是get请求的话 demo_id = request.GET.get('demo_id',0)
      
          # POST 请求
      
          params = json.loads(request.body)
      
      	demo_id = params.get('demo_id',0)
      
         	user_id = request.session.get('user_id', 0)
      
         	return_param = {}
      
          try:
      
          	 // 数据库操作
      
          	demo.objects.update_or_create(users_id=user_id, demo_id=demo_id, status=1)
      
              return JsonResponse(BaseResponse(code= SUCCESS_CODE, msg='success',data=[]).__dict__)
      
          except Exception as e:
      
      		return JsonResponse(BaseResponse(code=FAIL_CODE, msg='fail').__dict__)
      
      

注：如需转载请注明出处：https://www.cnblogs.com/zhuchenglin/p/10763795.html