mustache模板,用于构造html页面的内容,

前端html代码:

<select name="itemtype" id="itemtype" class="optionlist"></select>
<select name="business" id="business" class="optionlist"></select>
 

前端javascript代码:

<!-- 下拉框模板 -->
<script type="text/x-template" id="selecttmpl">
{{#option}}
<option value="{{value}}">{{text}}</option>
{{/option}}
</script>
$(function() {
  // 模板引擎
  var M = Mustache;   // 获取html页面中的模板x-template的值,根据id定位
  selectmoudle = $("#selecttmpl").html();   // 获取需要赋值的模板
  M.parse(selectmoudle);
  // 通过ajax调用后台接口获取数据  
  iniselectmoudle();
 
}
var iniselectmoudle = function() {
    "iniselectmoudle" : "1"
};
Util.ajax({
url : _settings.iniselectmoudle,
data : requestData,
type : 'POST',
success : function(response) {
// 项目类型下拉
          // 根据select标签的id属性值定位然后赋值
        $('#itemtype').html(M.render(selectmoudle, {
option : response.itemtypeList
}));
// 申报主题下拉
          // 根据后台接口返回的值JSONObject的String字符串类型,根据对应的key获取对应的value值,有些value值是JSONObject组成的list;
$('#business').html(M.render(selectmoudle, {
option : response.constructionpropertyList
}));

          // 可以同时给多个标签赋值           // select控件初始化,模糊搜索
/*
* $(".optionlist").chosen({ disable_search : true });
*/
}
});
}

后台action层业务管理层和service层业务逻辑实施层以及dao层数据访问层的restful接口的代码:

@RestController
@RequestMapping("/zwdtItem")
public class AuditOnlineItemController{
/**
* 咨询页面初始化下拉列表
* @param params 请求参数
* @param request HTTP请求
* @return
*/
@RequestMapping(value = "/iniselectmoudle", method = RequestMethod.POST)
public String iniselectmoudle(@RequestBody String params, @Context HttpServletRequest request) {
try {
log.info("=======开始调用iniselectmoudle接口=======");
JSONObject jsonObject = JSONObject.parseObject(params);
String token = jsonObject.getString("token");
if (ZwdtConstant.SysValidateData.equals(token)) {
JSONObject obj = (JSONObject) jsonObject.get("params"); // 可以根据前端ajax交互传回的参数执行判断执行不同的操作
String iniselectmoudle = obj.getString("iniselectmoudle"); // 获取相关数据以JSONObject组成的list形式返回前端,用于给模板select标签赋值
List<CodeItems> itemtypeListTemp = iCodeItemsService.listCodeItemsByCodeName("并联审批项目类型");
List<JSONObject> itemtypeList = new ArrayList<JSONObject>();
for (CodeItems c : itemtypeListTemp) {
JSONObject objCode = new JSONObject();
objCode.put("value", c.getItemValue());
objCode.put("pId", "0");
objCode.put("text", c.getItemText());
itemtypeList.add(objCode);
} // 调用方法返回由实体类或者JSONObject/Object类组成的ArrayList
List<AuditSpBusiness> businessListTemp = auditOnlineConsultService.findAuditSpBusinessList();
List<JSONObject> businessList = new ArrayList<JSONObject>();
for (AuditSpBusiness auditSpBusiness : businessListTemp) {
JSONObject objCode = new JSONObject();
objCode.put("value", auditSpBusiness.getRowguid());
objCode.put("pId", "0");
objCode.put("text", auditSpBusiness.getBusinessname());
businessList.add(objCode);
} JSONObject dataJson = new JSONObject();
dataJson.put("itemtypeList", itemtypeList);
dataJson.put("businessList", businessList);
return JsonUtils.zwdtRestReturn("1", "初始化下拉列表成功", dataJson.toString());
}
else {
log.info("=======结束调用iniselectmoudle接口=======");
return JsonUtils.zwdtRestReturn("0", "身份验证失败!", "");
}
}
catch (Exception e) {
return JsonUtils.zwdtRestReturn("0", "初始化下拉列表失败:" + e.getMessage(), "");
}
} }

ArrayList是Array的复杂版本,是一种动态数组;

mustache使用的更多相关文章

  1. 微信小程序技术分析:Mustache语法要点总结

    小程序开发的wxml里,用到了Mustache语法.所以,非常有必要把Mustache研究下. 什么是Mustache?Mustache是一个logic-less(轻逻辑)模板解析引擎,它是为了使用户 ...

  2. Javascript模板引擎mustache.js详解

    mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后只有9KB,非常值得在项目中使用.本文总结它的使用方法和一些使用心得,内容不算很高深 ...

  3. Mustache 使用总结

    前言: 在分析 jeesite 项目的时候,看到了 Mustache,于是查了下 正文: 1.Mustache 概述 Mustache 是基于 JavaScript 实现的模板引擎,即用来 渲染前台页 ...

  4. Mustache 使用心得总结

    Mustache 使用心得总结 前言: 之前的一个项目里面就有用到这个前台的渲染模版,当时挺忙的也没时间抽空总结一下,刚好上周项目里又用到这个轻量型的渲染模版,真心感觉很好用,因此就总结一下使用心得, ...

  5. mustache模板渲染的基本原理

    mustache.js是一个模板引擎,为开发节省了大量的“人力”,对于初学者,我是从这篇 和这篇 博客接触的,算是对mustache有了初步认识,不得不承认自己还是菜鸟阶段还有太多东西要学,慢慢熟悉. ...

  6. Mustache.js前端模板引擎源码解读

    mustache是一个很轻的前端模板引擎,因为之前接手的项目用了这个模板引擎,自己就也继续用了一会觉得还不错,最近项目相对没那么忙,于是就抽了点时间看了一下这个的源码.源码很少,也就只有六百多行,所以 ...

  7. mustache.js

    mustache.js 是一个 Mustache 模板系统的 JavaScript 实现. Mustache 模板语法的逻辑比较简单.它用于HTML,配置文件,源代码等.它的工作方式是通过通过以哈希值 ...

  8. mustache.js渲染带事件的模板

    http://zccst.iteye.com/blog/2183111 最近遇到这样一个问题,预览内容可点击,问题是通过$.Mustache.render("templateId" ...

  9. Mustache.js使用笔记(内容属于转载总结)

    1.Mustache的语法很简单,用两个大括号标记要绑定的字段即可,“{{}}” Mustache主要的渲染方法为Mustache.render(),该方法有两个参数,第一个为要渲染的模版, 也就是例 ...

  10. mustache模板技术

    一.简介Web 模板引擎是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,通常是标准的 HTML 文档.当然不同的开发语言有不同模板引擎,如 Javascript 下的 Hog ...

随机推荐

  1. Unity3D笔记 切水果 一

    最终效果: 一.选择背景图片,选择GUI Texture 二.创建一个空的GameObject,然后添加背景音乐 三.创建GUISkin 四.主要代码 #pragma strict var myGUI ...

  2. Freetds 连接数据库问题

    今天一个项目,需要用到连接SQLSERVER数据库,获取数据,按照以往的做法 ,安装了LNMP,装完之后在安装Freetds,然后在独立添加PHP的MSSQL的模块,./configure  make ...

  3. redis系列之数据库与缓存数据一致性解决方案

    redis系列之数据库与缓存数据一致性解决方案 数据库与缓存读写模式策略 写完数据库后是否需要马上更新缓存还是直接删除缓存? (1).如果写数据库的值与更新到缓存值是一样的,不需要经过任何的计算,可以 ...

  4. MTU-TCP/IP协议栈-linux kernel-TCP丢包重传-UDP高性能-AI- ip数据报 tcp数据报

    1.IP协议首部 TCP报文段的首部  UDP分组结构   ip数据报 tcp数据报 UDP校验 w 报文长度该字段指定UDP报头和数据总共占用的长度.可能的最小长度是8字节,因为UDP报头已经占用了 ...

  5. php之setcookie

    注意在任何发送请求头之前不能有输出,不然会获取不到header头 setcookie(key,value, expires, 'path', domain); 在发送cookie时,会自动把cooki ...

  6. range() 与 np.arange()

    转自:http://blog.csdn.net/lanchunhui/article/details/49493633 range()返回的是range object,而np.nrange()返回的是 ...

  7. MySQL left join right join inner join

    好记性不如烂笔头 sql连接共三种:内连接,外连接,交叉连接. 内连接包含:等值连接,不等值连接,自然连接 外连接包含:左连接(左外连接),右连接(右外连接) 具体理论见我的博文http://blog ...

  8. 几种常用CSS3样式

    在我们日常工作中,由于考虑到浏览器的兼容性,所以很少用CSS3样式.关于其标准,W3C 仍然在对 CSS3 规范进行开发.不过,现代浏览器已经实现了相当多的 CSS3 属性.最近学习了CSS3,发现功 ...

  9. 【Pyton】【小甲鱼】魔法方法

    1.__init__ >>> class Rectangle: def __init__(self,x,y): self.x=x self.y=y def getPeri(self) ...

  10. mysql 约束条件目录

    mysql 约束条件 mysql 约束条件 not null与default mysql 约束条件 unique key 唯一的键 mysql primary key 主键 mysql auto_in ...