haoshengxin/backend/views/webconfig/hot_search.php

<?php
/**
 * Created by PhpStorm.
 * User: Administrator
 * Date: 2017/3/17 0017
 * Time: 上午 10:52
 */
use yii\helpers\Url;
use yii\widgets\LinkPager;
?>
<style>
    .color{
        color: red;
    }
</style>

<div class="row">
    <div class="col-sm-12">
        <div class="ibox float-e-margins">
            <div class="ibox-content">
                <div class="row">
                    <div class="col-sm-5 m-b-xs">
                        <a  class="btn btn-sm btn-primary addhotsearch" href="#"> 新建热门搜索</a>
                    </div>

                </div>
                <div class="table-responsive">
                    <table class="table table-striped">
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th>热门搜索词</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <form id="checkForm" method="post">
                            <?php $i=0; foreach($datas as $data):?>
                                <tr>
                                    <td><?php $i++;echo $i;?></td>
                                    <td class="keyword"><?= $data->keyword?></td>
                                    <td>
                                        <a href="#" data="true" hotsearchid="<?= $data->id?>" class="btn btn-sm btn-primary edit_search">修改</a>
                                        <a class="btn btn-sm btn-danger del_search"hotsearchid="<?= $data->id?>">删除</a>
                                    </td>
                                </tr>
                            <?php endforeach;?>

                        </form>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    var lock = true;
    $('.addhotsearch').click(function(){
        if(lock){
            var i = $('tr').length;
            var html = '<tr><td>'+parseInt(i-1)+'</td><td class="keyword"><input width="20px"></td><td>';
            html+='<a href="#" data="false"  class="btn btn-sm btn-primary edit_search">添加</a>';
            html+='<a class="btn btn-sm btn-danger del_search">删除</a></td></tr>';
            $('tbody').append(html);
        }
       lock = false;
    });
    $('.table-responsive').on('click','.edit_search',function(){
        var tr = $(this).parents('tr');
        if($(this).attr('data')=='true'){
            var keyword = $(this).parents('tr').find('.keyword').text();
            var html = '<input value="'+keyword+'">';
            $(this).parents('tr').find('.keyword').html(html);
            $(this).attr('data','false');
            $(this).text('确认');
        }else{
            var type = $(this).text();
            var tr = $(this).parents('tr');
            var keyword = $(this).parents('tr').find('input').val();
            $(this).attr('data','true');
            $(this).text('修改');
            if(type=='添加'){
                $.ajax({
                    url:'<?=Url::toRoute(['webconfig/addhotsearch']);?>',
                    type:'POST',
                    dataType:'json',
                    data:{keyword:keyword,'_csrf-backend':'<?=Yii::$app->request->csrfToken;?>'},
                    success:function(data){
                        if(data.sign==1){
                            swal("", data.msg, "success");
                            tr.find('.keyword').html(keyword);
                            tr.find('.edit_search').attr('hotsearchid',data.id);
                            tr.find('.del_search').attr('hotsearchid',data.id);
                            lock = true;
                        }else{
                            swal("", data.msg, "error");
                            tr.remove();
                            lock = true;
                        }
                    }
                })
            }else if(type=='确认'){
                var id = $(this).attr('hotsearchid');
                $.ajax({
                    url:'<?=Url::toRoute(['webconfig/edithotsearch']);?>',
                    type:'POST',
                    dataType:'json',
                    data:{id:id,keyword:keyword,'_csrf-backend':'<?=Yii::$app->request->csrfToken;?>'},
                    success:function(data){
                        if(data.sign==1){
                            swal("", data.msg, "success");
                            tr.find('.keyword').html(keyword);
//                            $(this).attr('hotsearchid',data.id);
//                            tr.find('.del_search').attr('hotsearchid',data.id);
//                            lock = true;
                        }else{
                            swal("", data.msg, "error");
//                            tr.remove();
                        }
                    }
                })
            }
        }
    });
    $('.table-responsive').on('click','.del_search',function(){
        var id = $(this).attr('hotsearchid');
        var tr = $(this).parents('tr');
        swal({
                title: "确定删除吗?",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                closeOnConfirm: true,
                closeOnCancel: true },
            function(isConfirm){
                if (isConfirm) {
                    $.ajax({
                        url:'<?=Url::toRoute(['webconfig/delhotsearch']);?>',
                        type:'POST',
                        dataType:'json',
                        data:{id:id,'_csrf-backend':'<?=Yii::$app->request->csrfToken;?>'},
                        success:function(data){
                                tr.remove();
                                if(data.sign==1){
                                    tr.remove();
                                }else{
                                    swal("", data.msg, "error");
                                }

                        }
                    })
                }
            });
    })
</script>