通过模态提示框与ajax删除某个字段的实现过程


发布时间:2019-02-15 13:08    作者: Uncle Hui   已过去:1 年,9 月   阅读总量:518 已被赞:0


有些字段我们不需要的时候,就需要删掉它,那么如何通过模态提示框与ajax来共同实现呢?本文以删除新闻分类为例:

第一步:建立删除处理视图

#删除新闻分类
@require_POST
def del_news_fenlei(request):
    id = request.POST.get('id')
    try:
         NewsCategory.objects.filter(id=id).delete()
         return restful.ok()
    except:
         return restful.params_error(message='分类不存在')

 

第二步:建立对应url

path('del_news_fenlei/', del_news_fenlei,name='del_news_fenlei'),#删除新闻分类

第三步:给前端按钮绑定class 和原来的值

{% for category in categories %}
    <tr data-pk="{{ category.pk }}" data-name="{{ category.name }}">
        <td>{{ category.name }}</td>
        <td>20</td>
        <td>
            {% csrf_token %}
            <button class="btn btn-warning btn-xs edit-btn">编辑</button>
            <button class="btn btn-danger btn-xs delete-btn">删除</button>
        </td>
    </tr>
{% endfor %}

第四步:js 书写(写在前面修改新闻把标签一起的js里)

NewsCategory.prototype.listenDelnewsfenleiEvent=function () {
    //获取按钮
   var del_btn = $('.delete-btn');
    //绑定事件

    del_btn.click(function () {
        //获取原来的ID与名字
        //1.绑定this
        var delsBtn = $(this);
        //2.或取 tr上的绑定内容前,先等我tr
        var tr =delsBtn.parent().parent();
        //3.获取值
        var id = tr.attr('data-pk');
        var name= tr.attr('data-name');
        //弹出模态确认框
        xfzalert.alertConfirm({
            //标题
            'title':'确定删除这个分类?',
            'text':name,

            //确认点击后
            'confirmCallback':function () {
                xfzajax.post({
                    'url':'/cms/del_news_fenlei/',
                    'data':{
                        'id':id
                    },
                    'success':function (result) {
                        if(result['code']===200){
                            window.location.reload();
                        }else{
                            xfzalert.close();
                        }
                    }
                })
            }
        })
    })
}

完成后测试,完整js下载

点赞

0




登陆后方可评论