需求描述:页面中有两个列表,一个已添加,一个可以添加,进入页面的时候,如果已添加中有数据则显示,没有数据就隐藏,emmmm,这种需求,我该怎么吐槽嗷嗷嗷

解决思路:让已添加的列表的div默认隐藏,前台接收后台传递过来的标志(该标志是已添加列表是否有数据),如果有,就把已添加列表的div设置为显示

代码:

//html代码
<div class="row" id="tableDivOne" style="display: none;">
  <table>
   //列表中间内容省略
  </table>
</div> //后台java代码
map.addAttribute("listed", list);
return VIEW_PATH + "/toAddProd";

//js代码
var prodAdded = [[${listed}]]; //接收传过来的list
if (CommnUtil.notNull(prodAdded)) {
  //如果prodADDed的长度大于0说明已添加列表有数据
if (prodAdded.length > 0) {
document.getElementById("tableDivOne").style.display="block";//显
}
}

啰嗦一句:别的代码也可以实现  下边是同事的代码:

//html代码
<div class="row" id="addedDiv" hidden="hidden">
  <table>
   //····
  </table>
</div> //js代码
var addedIds = [[${addedList}]];
if (CommnUtil.notNull(addedIds)) {
if (addedIds.length > 0) {
$("#addedDiv").prop('hidden', false);
}
}

总结:推荐用我的哈O(∩_∩)O哈哈~,为啥呢  原生js兼容性肯定比他的好啊

进入页面,根据后台传过来的flag 判断列表隐藏与否的更多相关文章

  1. jsp页面获取后台传过来的list集合的长度

    在jsp页面导入函数标签库: <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"% ...

  2. 步步为营-73-asp.net的简单练习(根据美工提供静态页面,编写后台代码)

    说明:实际企业中开发分工是很明确,往往程序员根据美工提供的UI界面进行后台代码的编写. 1.1 原始HTML页面 1.2 使用aspx进行修改 这里使用到了三层架构 using System; usi ...

  3. 利用JavaScript将页面截图生成图片传给后台的插件:html2canvas

    利用JavaScript将页面截图生成图片传给后台的插件:html2canvas 一.总结 一句话总结: 10 <script type="text/javascript"& ...

  4. ajax往后台传json格式数据报415错误

    问题描述: ajax往后台传json格式数据报415错误,如下图所示 页面代码 function saveUser(){ var uuId = document.getElementById(&quo ...

  5. asp.net向后台传参数动态加载图片

    //向后台传参数动态加载图片 $(function() { $("#Button1").click(function() { var stockcode = getUrlParam ...

  6. Thymeleaf在前台下拉列表获取后台传的值

    Thymeleaf在前台下拉列表获取后台传的值 后台添加代码: /** * 新增机构 */ @GetMapping("/add") public String add(ModelM ...

  7. fastTime从后台传过来显示格式的处理

    1.可以在控制台用syso查看 QuestionFeedbackView qfv = on_LineManageService.getBringupHead(projectNo);//qfv是一个内含 ...

  8. Web jsp开发学习——前端后台传参方法

    一.前端传后台: 1.1表单数据的传递   前端的表单里定义名字name   后台通过名字获取输入的值         1.2页面点击了哪个按钮传递 登录注销的另一种方式   点击登录的地方设置参数 ...

  9. 用jQuery.ajaxWebService请求WebMethod,Ajax处理实现局部刷新;及Jquery传参数,并跳转页面 用post传过长参数

    首先在aspx.cs文件里建一个公开的静态方法,然后加上WebMethod属性. 如: [WebMethod]  public static string GetUserName()   {  //. ...

随机推荐

  1. react组件之间的组合方式

    组合方式: 1/直接嵌套的方式 2/组件以变量的形式放置 3/可以通过props值,以变量的形式相当于作为参数传递父组件,然后进行组合 import React,{Component} from 'r ...

  2. Centos7使用man查找命令时,报错No manual entry for xxxx

    man ascii时报错 解决报错的方法: yum install man-pages

  3. python中重要的模块--asyncio 转载

    转载自: https://www.cnblogs.com/zhaof/p/8490045.html 一直对asyncio这个库比较感兴趣,毕竟这是官网也非常推荐的一个实现高并发的一个模块,python ...

  4. 【VMware vSphere】vCenter添加主机失败:无法访问指定主机

    背景 前一段时间,给一台服务器安装ESXi系统,安装成功之后,通过vCenter在上面安装了一台VDP系统.结果前几天发现服务器掉线,重新连接时出现问题.问题描述如下: 其中错误堆栈具体内容为:在 v ...

  5. Path Sum I && II & III

    Path Sum I Given a binary tree and a sum, determine if the tree has a root-to-leaf path such that ad ...

  6. C/C++经典面试题一

    1.变量的声明和定义有什么区别? 常量:在程序执行过程中,不会发生改变的量,不能被改变的量 变量:在程序执行过程中,可以被改变的量 定义变量的方式:数据类型 变量名 = 常量: int num = 1 ...

  7. Euclideanloss_layer层解析

    这里说一下euclidean_loss_layer.cpp关于该欧式loss层的解析,代码如下: #include <vector> #include "caffe/layers ...

  8. Linux RTC驱动模型分析之rtc-sysfs.c【转】

    转自:https://blog.csdn.net/longwang155069/article/details/52353408 版权声明:本文为博主原创文章,未经博主允许不得转载. https:// ...

  9. ping 丢包或不通时链路测试说明【转】

    转自:https://help.aliyun.com/knowledge_detail/40573.html?spm=5176.2020520165.121.d157.4fe170291Qdp4l#W ...

  10. 从url(地址栏)获取参数:Jquery中getUrlParam()方法的使用

    我想要获取如下id 如下代码(传参要加问好!!) function getUrlParam(id) { var regExp = new RegExp('([?]|&)' + id+ '=([ ...