需求描述:页面中有两个列表,一个已添加,一个可以添加,进入页面的时候,如果已添加中有数据则显示,没有数据就隐藏,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. tcp黏包

    转载https://www.cnblogs.com/wade-luffy/p/6165671.html 无论是服务端还是客户端,当我们读取或者发送消息的时候,都需要考虑TCP底层的粘包/拆包机制. 回 ...

  2. mysql 案例 ~ mysql字符集详解

    一 谈谈mysql常见的字符集问题 二 字符集统一  1 character_set_server  2 character_set_client  3 java/php等连接字符集  4 chara ...

  3. 《jQuery精品教程视频》-每天的复习笔记

    第一天 //jquery:简单.粗暴 //jq和js的关系 //js是什么? js是一门编程语言 //jq仅仅是基于js的一个库,jq可理解为就是开发js的一个工具. //概念 //1. 为什么要学j ...

  4. 为何invalidate()不可以直接在UI线程中调用&invalidate与postInvalidate

    1.android ui操作为什么一定要在主线程中执行? 答:Android UI操作是单线程模型,关于UI更新的相关API(包括invalidate())都是按照单线程设计的,对于多线程运行时不安全 ...

  5. 工具方法 .js

    1. 获取url问号后面,name的值 /** * *?id=123&a=b * @return object */export function urlParse(){ let url = ...

  6. C++ operator(重载操作符) 【转】

    转自:http://www.cnblogs.com/xiangxiaodong/archive/2012/02/12/2348144.html operator是C++的关键字,它和运算符一起使用,表 ...

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

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

  8. 【VMware vSphere】ESXi系统开启SSH协议

    写在前面:           SSH为建立在应用层基础上的安全协议,是目前较为可靠,专为远程登录会话和其他网络服务提供安全性的协议.感兴趣的话,可以百度了解           在这里,我们需要将S ...

  9. mac 电脑连接linux 服务器

    Mac 电脑下连接Linux服务器 命令: ssh -p 端口号(22) 用户名@ip OK,输入密码,搞定

  10. qunee 开发清新、高效的拓扑图组件 http://www.qunee.com/

    qunee  开发清新.高效的拓扑图组件  http://www.qunee.com/ RoadFlow:  http://www.cqroad.cn/ 村暖花开