九、用户模块
7、取消收藏机构
用户取消收藏机构应该在operations下实现。
(1)、url
from django.urls import path from .views import * app_name = 'operations' urlpatterns = [ path('user_ask', user_ask, name='user_ask'), path('user_love', user_love, name='user_love'), path('user_comment', user_comment, name='user_comment'), path('user_delete', user_delete, name='user_delete'), ]
(2)、前端页面
用户收藏的机构是由后端传递过去的,前端通过for循环遍历,将机构存放在dl中,这时候我们需要知道用户取消哪个机构。
所以将class='delete jsDeleteFav_org'的div中的data-favid直接存为机构的id。
<script> $(function () { $('.delete').click(function () { // prop()用来取自带属性的值或设置值, attr()用来去元素自定义的属性的值或设置值 var loveid = $(this).attr('data-favid'); // 如果天生的属性用 prop() var lovetype = 1; var obj = $(this); $.ajax({ type: 'GET', url: '{% url 'operations:user_delete' %}', data:{ loveid:loveid, lovetype:lovetype }, success(callback){ if (callback.status == 'ok'){ alert(callback.msg); //拿到点击对象的祖先节点当中有类名是des的对象 obj.parents('.des').remove() //拿到dl标签,并移除 }else{ alert(callback.msg) } } }) }) }) </script>
同时在调试的过程中,发现二级base中的一个js对当前页面有影响,为了保留原本的js,切不影响当前页面,在二级base中挖坑,将这个js包含,当前页面填坑重写。置空。
{% extends 'users/usercenter-base.html' %} {% load staticfiles %} {% block title %} 我的收藏- 谷粒教育网 {% endblock %} {% block breach %} 我的收藏 {% endblock %} {% block right %} <div class="right" > <div class="personal_des Releasecont"> <div class="head"> <h1>我的收藏</h1> </div> </div> <div class="personal_des permessage"> <div class="head"> <ul class="tab_header messagehead"> <li class="active"><a href="{% url 'users:user_loveorg' %}">课程机构</a> </li> <li><a href="usercenter-fav-teacher.html">授课教师 </a></li> <li><a href="usercenter-fav-course.html">公开课程</a></li> </ul> </div> <div class="messagelist"> <div class="messages butler_list company company-fav-box"> {% for org in org_list %} <dl class="des fr"> <dt> <a href="{% url 'orgs:org_detail' org.id %}"> <img width="160" height="90" src="{{ MEDIA_URL }}{{ org.image }}"/> </a> </dt> <dd> <h1><a href="{% url 'orgs:org_detail' org.id %}">{{ org.name }}</a></h1> <div class="pic fl" style="width:auto;"> <img src="{% static 'images/authentication.png' %}"/> <img src="{% static 'images/gold.png' %}"/> </div> <span class="c8 clear">{{ org.address }}</span> <div class="delete jsDeleteFav_org" data-favid="{{ org.id }}"></div> </dd> </dl> {% endfor %} </div> </div> </div> </div> {% endblock %} {% block user %} {% endblock %} {% block myjs1 %} <script> $(function () { $('.delete').click(function () { // prop()用来取自带属性的值或设置值, attr()用来去元素自定义的属性的值或设置值 var loveid = $(this).attr('data-favid'); // 如果天生的属性用 prop() var lovetype = 1; var obj = $(this); $.ajax({ type: 'GET', url: '{% url 'operations:user_delete' %}', data:{ loveid:loveid, lovetype:lovetype }, success(callback){ if (callback.status == 'ok'){ alert(callback.msg); //拿到点击对象的祖先节点当中有类名是des的对象 obj.parents('.des').remove() //拿到dl标签,并移除 }else{ alert(callback.msg) } } }) }) }) </script> {% endblock %}
{% extends 'base.html' %} {% load staticfiles %} {% block mycss %} <link rel="stylesheet" type="text/css" href="{% static 'js/plugins/queryCity/css/cityLayout.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'css/lq.datetimepick.css' %}"/> {% block mycss1 %} {% endblock %} {% endblock %} {% block middle %} <div class="middle"> <div class="wp"> <a href="/"><img class="fl" src="{% static 'images/logo1.png' %}"/></a> <h1>我的谷粒教育网</h1> </div> </div> {% endblock %} {% block content %} <section> <div class="wp"> <ul class="crumbs"> <li><a href="/">首页</a>></li> <li><a href="{% url 'users:user_info' %}">个人中心</a>></li> <li>{% block breach %}{% endblock %}</li> </ul> </div> </section> <section> <div class="wp list personal_list"> <div class="left"> <ul> <li class="active2"><a href="{% url 'users:user_info' %}">个人资料</a></li> <li ><a href="{% url 'users:user_course' %}">我的课程</a></li> <li ><a href="{% url 'users:user_loveorg' %}">我的收藏</a></li> <li > <a href="usercenter-message.html" style="position: relative;"> 我的消息 </a> </li> </ul> </div> {% block right %} {% endblock %} </div> </section> {% block dialog %} <div class="dialog" id="jsDialog"> <div class="resetpwdbox dialogbox" id="jsResetDialog"> <h1>修改密码</h1> <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div> <div class="cont"> <form id="jsResetPwdForm" autocomplete="off"> <div class="box"> <span class="word2" >新 密 码</span> <input type="password" id="pwd" name="password1" placeholder="6-20位非中文字符"/> </div> <div class="box"> <span class="word2" >确定密码</span> <input type="password" id="repwd" name="password2" placeholder="6-20位非中文字符"/> </div> <div class="error btns" id="jsResetPwdTips"></div> <div class="button"> <input id="jsResetPwdBtn" type="button" value="提交" /> </div> <input type='hidden' name='csrfmiddlewaretoken' value='DaP7IUKm9FA9nELA9YUlYYWpyIDdCiIP' /> <input type='hidden' name='csrfmiddlewaretoken' value='799Y6iPeEDNSGvrTu3noBrO4MBLv6enY' /> </form> </div> </div> <div class="dialogbox changeemai1 changephone" id="jsChangeEmailDialog"> <h1>修改邮箱</h1> <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div> <p>请输入新的邮箱地址</p> <form id="jsChangeEmailForm" autocomplete="off"> <div class="box"> <input class="fl change_email" name="email" id="jsChangeEmail" type="text" placeholder="输入重新绑定的邮箱地址"> </div> <div class="box"> <input class="fl email_code" type="text" id="jsChangeEmailCode" name="code" placeholder="输入邮箱验证码"> <input class="getcode getting" type="button" id="jsChangeEmailCodeBt" value="获取验证码"> </div> <div class="error btns change_email_tips" id="jsChangeEmailTips" >请输入...</div> <div class="button"> <input class="changeemai_btn" id="jsChangeEmailBt" type="button" value="完成"/> </div> <input type='hidden' name='csrfmiddlewaretoken' value='DaP7IUKm9FA9nELA9YUlYYWpyIDdCiIP' /> <input type='hidden' name='csrfmiddlewaretoken' value='799Y6iPeEDNSGvrTu3noBrO4MBLv6enY' /> </form> </div> </div> <div class="bg" id="dialogBg"></div> {% endblock %} {% endblock %} {% block footer %} {% endblock %} {% block myjs %} <script src='{% static 'js/plugins/jquery.upload.js' %}' type='text/javascript'></script> <script src="{% static 'js/validate.js' %}" type="text/javascript"></script> {% block user %} <script src="{% static 'js/deco-user.js' %}"></script> {% endblock %} {% block myjs1 %} {% endblock %} <script> $(function () { $('#jsChangeEmailCodeBt').click(function () { var email = $('#jsChangeEmail').val(); $.ajax({ type: 'POST', url : '{% url 'users:user_changeeamil' %}', data : { email: email, csrfmiddlewaretoken: '{{ csrf_token }}' }, success(callback){ if (callback == 'ok'){ alert(callback.msg) }else{ alert(callback.msg) } } }) }); $('#jsChangeEmailBt').click(function () { var eamil = $('#jsChangeEmail').val(); var code = $('#jsChangeEmailCode').val(); $.ajax({ type: 'POST', url: '{% url "users:user_resetemail" %}', data:{ email: eamil, code: code, csrfmiddlewaretoken: {{ csrf_token }} }, success:function (callback) { if(callback.status == 'ok'){ alert(callback.msg); window.location.herf = '{% url "users:login" %}' //修改成功后需要重新登录 }else{ alert(callback.msg) } } }) }) }) </script> {% endblock %}
(3)、视图函数
# operations/view.py def user_delete(request): loveid = request.GET.get("loveid", '') lovetype = request.GET.get('lovetype', '') if loveid and lovetype: love = UserLove.objects.filter(love_id=int(loveid), love_type=int(lovetype), love_man=request.user, love_status=True) if love: love[0].love_status = False love[0].save() return JsonResponse({ 'status': 'ok', 'msg': '取消成功' }) else: return JsonResponse({ 'status': 'fail', 'msg': '取消失败' }) return JsonResponse({ 'status': 'fail', 'msg': '取消失败' })