table新增一行后,页面不显示新增的行?

讨论 已结
17 650
qiezhi
qiezhi 2018-9-5
悬赏:20飞吻
页面设一个按钮,点击后进入controller将数据库新增加一行空数据,但是table.reload后页面没变化,另外想要加完数据后直接跳到最后一页怎么弄。
<a class="button button-primary button-pill button-small" onclick="ADDData()">新增</a>
<script type="text/javascript">
function ADDData() {

$.ajax({
async: false,
cache: false,
type: 'POST',
contentType: "application/json",
url: "/User/Add_data",
error: function () {
alert('新增数据失败');
},
success: function (){
alert('新增数据成功');
},
});
var table = layui.table;
table.reload('ShenShiYouJiao', {
url: '../User/AutoResponse'
});
}
</script>
回帖
  • @qiezhi reload实际没什么特别注意的感觉,如果url接口没变化也是不需要在reload里面再写一下的,你这个写法是错的,你这个table一开始就是url:url这种取数的吧?data只接收一个数组,所以你这样子reload肯定是有问题,实际的关键问题不是reload是得到新加进去的数据位于第几页,这个才是关键的问题,怎么说呢先撇开其他的因素把,就认定,加入了之后一定是最后一页,那么reload最后一页就可以了,但是实际上不是新加入的数据绝对就是在最后一页。先不管这个按照最后一页的来那么大概代码如下
    // 假设一开始有变量保存render的返回,这个后面可以得到表格目前的配置信息
    var tableIns = table.render({});

    // 下面是需要reload最后一页的时候
    // 计算出最后一页
    var config = tableIns.config;
    var pageTemp = tableIns.page;
    // 假设每次只新增一条,用新的总条数除以limit向上取整得到新的页数
    var currTemp = Math.ceil((pageTemp.count + 1)/pageTemp.limit)
    tableIns = table.reload(tableId, {
    page: {
    curr: currTemp||1
    }
    });
    0 回复
  • debugger一下reload执行了没有,没有报错,table也reload了的话,你说的不显示新增加的行这个,我的理解是你新增加的行在这个表格当前的条件下不是在第一页即使reload的你也在这个页面看不到,当然你要是说的不是这个而是reload没有执行或者表格没有重载,那是另外的问题,不知道你说的是哪个。
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 这是什么意思呀?
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 点击增加按钮后,页面数据总数没变,所以是前端没显示出来
    0 回复
  • @qiezhi ?你问的是?init是什么?还是问的是什么,感觉跟你上面的问题没什么关系额,主要你要看table.reload执行了没有,有没有重新请求重载表格额,感觉是有的,其实你的困惑是你新增了一条记录,然后重载这个表格,但是重载之后看不到你新增的那条数据是吗?如果是这样子的话要看看你新增的那条数据是否满足你现在的查询的条件查出来的结果,如果不满足,不管你怎么reload都出不来是不是,如果满足,你说的“看不到”实际我觉得是还没看到,你看下reload之后总条数变了没有,实际可能你新增的那条记录是在最后一页,reload了第一页当然也看不到。
    0 回复
  • @qiezhi 嗯嗯,这个问题感觉一般的套路是看数据保存到表里面了没有,然后看reload的时候重新请求了没有,请求的参数和返回啥的都检查一下,不排除你新增的记录不满足你当前表格的查询条件的可能。这个只能一个一个排查了额。
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 还是不行呀,table表格我想加一个空行,同时页面跳到新加数据这页,该怎么做呢?
    0 回复
  • @qiezhi 这个有点难度,首先确认一个情况,表格是url模式的,然后新增一个空行的意思也是发ajax新增了也存到数据库了就是想要reload的时候能跳到有这条数据的那一页能够直接看到对吧,这个说难主要是你要怎么确认它存在第几页,如果能得到,这个就简单了,直接reload的时候指定page: {curr: 页码}
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 前面的没问题,主要是reload不太会用,有例子吗,给一个
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 这样写新加数据重载不了,该怎么写呢
    function ADDData() {

    $.ajax({
    async: false,
    cache: false,
    type: 'POST',
    contentType: "application/json",
    url: "/User/Add_data",
    error: function () {
    alert('新增数据失败');
    },
    success: function (){
    alert('新增数据成功');
    },
    });
    layui.use('table', function () {
    var table = layui.table;
    table.reload('AddReload', {
    page: {
    curr: 1 //重新从第 1 页开始
    }
    , data: '../User/AutoResponse'
    })
    }
    );

    }
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 还是不行,可以跳到最后一页,但是新加数据还是显示不出来
    <a class="button button-primary button-pill button-small" onclick="ADDData()">新增</a>
    <script type="text/javascript">
    function ADDData() {
    var table = layui.table;
    var tableIns = table.render({});
    $.ajax({
    async: false,
    cache: false,
    type: 'POST',
    contentType: "application/json",
    url: "/User/Add_data",
    error: function () {
    alert('新增数据失败');
    },
    success: function (result){
    alert('新增数据成功'+result);
    var DangQianYe = Math.ceil(result / 10);
    tableIns = table.reload('AddReload', {
    page: {
    curr: DangQianYe
    }
    });
    },
    });
    }
    </script>
    控制器源码,会返回当前数据库数据总数
    [HttpPost]
    public int Add_data()
    {
    DealData.AddData();
    string temp=DealData.ChaXunDataSum();
    int temp1=int.Parse(temp);
    return (temp1);
    }
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 这种reload每个页返回的数据一直没刷新,只有再新增一个页时,那个页的数据才会变,而其他页的数据都没变
    0 回复
  • qiezhi
    2018-9-5
    @岁月小偷 解决了,不是reload的问题,也不是程序的问题。是页面设置的问题,页面缓存未更新,所以新加的数据刷不出来,浏览器设置成下面这样就好了。
    0 回复
  • @qiezhi 好吧,ie浏览器的缓存是有坑
    0 回复
  • @岁月小偷 问一下,怎么解决缓存问题呢?我不可能到每个客户端去改设置吧?
    我记得ajax有个改缓存的属性
    另外给的参数里可以加个当前时间
    这两种方法哪种可行?哪种更好?你的方法是什么呢?
    谢谢
    ps:新人没飞吻,第一个项目,多担待,谢谢
    0 回复
  • @再见戈多 我印象中ie的缓存问题主要出现在两个请求是一模一样的,就会出现,所以一般来说可以在url或者请求的data或者headers里面加多一个参数过去比如可以是请求发送的时间点比如在where里面
    where: {time: new Date().getTime()}
    试试看管用不,原理就是让它每次请求都跟上次请求是不一样的,不然如果条件都一样可能就被认定为一样的请求,就直接缓存了。
    0 回复
  • @岁月小偷 可以帮忙看下这个问题吗https://fly.layui.com/jie/48334/ 点击按钮添加一行数据的
    0 回复