js获取后台数据

CreateTime--2017年5月26日16:14:14
Author:Marydon

  在js中使用el表达式的前提是:HTML引用js使用内联方式(即在JSP页面内部使用js),使用外联(即引入的外部js文件)不支持使用el表达式。

  1.使用el表达式获取

    数据格式:java-List<Map>

{data=[{TERM=第一期, WANGWU=199, LISI=229, ZHAOLIU=233, SANQI=234, ZHANGSAN=233},{TERM=第二期, WANGWU=156, LISI=186, ZHAOLIU=179, SANQI=206, ZHANGSAN=234}, {TERM=第三期, WANGWU=133, LISI=161, ZHAOLIU=246, SANQI=185, ZHANGSAN=240}, {TERM=第四期, WANGWU=194, LISI=126, ZHAOLIU=190, SANQI=207, ZHANGSAN=229},{TERM=第五期, WANGWU=149, LISI=166, ZHAOLIU=209, SANQI=174, ZHANGSAN=197}], code=0, expMsg=, msg=操作成功}

    取值

/**
* 在js中使用EL表达式获取后台返回的数据
*/
var row = '${model.data}';

    row 代表的是

[{TERM=第一期, WANGWU=199, LISI=229, ZHAOLIU=233, SANQI=234, ZHANGSAN=233}, {TERM=第二期, WANGWU=156, LISI=186, ZHAOLIU=179, SANQI=206, ZHANGSAN=234}, {TERM=第三期, WANGWU=133, LISI=161, ZHAOLIU=246, SANQI=185, ZHANGSAN=240}, {TERM=第四期, WANGWU=194, LISI=126, ZHAOLIU=190, SANQI=207, ZHANGSAN=229}, {TERM=第五期, WANGWU=149, LISI=166, ZHAOLIU=209, SANQI=174, ZHANGSAN=197}]

    特别注意:不能用for循环

/**不能用for循环
* for (var i =0; i<row.length; i++) {
* xAxisValues.push('${row[i].TERM}');
* }
*/  

    只能用jstl标签库的c标签迭代

<c:forEach var="row" items="${model.data}">
xAxisValues.push('${row.TERM}');
</c:forEach>
console.log(xAxisValues);

  2.使用小脚本获取

/*
* 在js中也可以使用小脚本获取后台返回的数据
*/
var test = '<%=request.getAttribute("model")%>';

  获取的值是:

{data=[{TERM=第二期, WANGWU=156, LISI=186, ZHAOLIU=179, SANQI=206, ZHANGSAN=234}, {TERM=第三期, WANGWU=133, LISI=161, ZHAOLIU=246, SANQI=185, ZHANGSAN=240}, {TERM=第五期, WANGWU=149, LISI=166, ZHAOLIU=209, SANQI=174, ZHANGSAN=197}, {TERM=第一期, WANGWU=199, LISI=229, ZHAOLIU=233, SANQI=234, ZHANGSAN=233}, {TERM=第四期, WANGWU=194, LISI=126, ZHAOLIU=190, SANQI=207, ZHANGSAN=229}], code=0, expMsg=, msg=操作成功}

UpdateTime--2017年8月23日15:37:46

小结:

  1. javascript获取后台数据有两种方式:使用小脚本;使用EL表达式;  

  2. 前提:引入js的方式必须是在本页面上;

  3. 对于后台返回的List,在js里面直接嵌套<c:forEach var="" items="${}"></c:forEach>即可。

实例:

  后台返回的是页面和数据,数据格式是一个list,前台用EL表达式接收的话,返回的是一个字符串,怎样让它的数据类型还是数组呀?

  第一种方式:

/**
* 方式一:使用c:forEach迭代(推荐方式)
*/
window.onload=function (){
// 1.获取文件路径
var filePath = "${model.filePath}";
// 2.使用forEach循环执行 利用dcm插件批量打开文件
<c:forEach var="fileName" items="${model.fileNames}">
// 2.1 获取文件名称  
var fileName = "${fileName}";
// 2.2设置文件访问路径
var path = "<%=basePath%>" + filePath;
path += "/" + fileName;
// 2.3 添加要打开的文件
document.getElementById("myMovieName").OpenImage(path,"dcm",fileName,"d:\\temp",0);
</c:forEach>

  解析结果:

  第二种方式

  HTML部分

<div style="display: none" id="fileNamePool">
<c:forEach var="fileName" items="${model.fileNames}">
<input type="hidden" value="${fileName }" />
</c:forEach>
</div>

  javascript部分

/**
* 方式二:往页面赋值,再取值
*/
window.onload=function (){
// 1.获取文件路径
var filePath = "${model.filePath}";
// 2.获取页面上指定区域的隐藏域
var inputTags = $('#fileNamePool input:hidden');
// 3. 使用dcm插件批量打开文件
for (var i = 0; i < inputTags.length; i++) {
// 3.1 获取文件名称
var fileName = inputTags[i].value;
// 3.2 设置文件访问路径
var path = "<%=basePath%>" + filePath;
path += "/" + fileName;
// 3.2 添加要打开的文件
document.getElementById("myMovieName").OpenImage(path,"dcm",fileName,"d:\\temp",0);
}
}

  第三种方式

<script type="text/javascript">
/**
* 方式三:发送Ajax请求,重新获取数据
*/
window.onload=function (){
var ORG_ID = "${model.ORG_ID}";
var PATIENTCODE = "${model.PATIENTCODE}";
var param = "ORG_ID=" + ORG_ID + "&PATIENTCODE=" + PATIENTCODE + "&RESULT_TYPE=jsonResult"; var request = new $WebRequest(
baseUrl + "/telemedicine/reseCons/showDcm.do", param,
function(result) {
getJsonResult(result, function (result) {
// dcm文件的名称
var fileNames = result.fileNames;
// 文件路径
var filePath = result.filePath;
for (var i = 0; i < fileNames.length; i++) {
var path = "<%=basePath%>" + filePath;
path += "/" + fileNames[i];
document.getElementById("myMovieName").OpenImage(path,"dcm",fileNames[i],"d:\\temp",0)
}
});
},null,true);
request.Start();
}
</script>

相关推荐:

    js与jQuery实现方式对比汇总

     js与jQuery方法对比

 

javascript-使用el表达式获取后台传递的数据的更多相关文章

  1. jsp用el表达式获取后台传来的值,或者获取session中的值

    <script type="text/javascript"> var usernameC = ${sessionScope.SESSION_USER_PROFILE. ...

  2. EL表达式获取数据

    EL 全名为Expression Language. EL主要作用 获取数据: •EL表达式主要用于替换JSP页面中的脚本表达式,以从各种类型的web域 中检索java对象.获取数据.(某个web域 ...

  3. SSH 框架controller向jsp传递List jsp中使用el表达式获取

    mvc可以使用ModelAndViev传递数据选择跳转的视图 controller中的代码, 把一个模拟的表单studentListSimulate传给ModelAndView @RequestMap ...

  4. 转:el表达式获取map对象的内容 & js中使用el表达式 & js 中使用jstl 实现 session.removeattribute

    原文链接: ①EL表达式取Map,List值的总结 ②在jsp中使用el表达式通过键获得后台的一个map<Long,String>的值 ③在javascript中使用el表达式(有图有真相 ...

  5. EL表达式获取Map和List中的值

    EL表达式获取Map和List中的值   EL表达式取Map中的值: 当Map中是String,String时 后台servlet中: Map<String, String> map1 = ...

  6. JAVAWEB开发之Session的追踪创建和销毁、JSP具体解释(指令,标签,内置对象,动作即转发和包括)、JavaBean及内省技术以及EL表达式获取内容的使用

    Session的追踪技术 已知Session是利用cookie机制的server端技术.当client第一次訪问资源时 假设调用request.getSession() 就会在server端创建一个由 ...

  7. EL表达式获取对象属性的原理

    EL表达式获取对象属性的原理是这样的: 以表达式${user.name}为例 EL表达式会根据name去User类里寻找这个name的get方法,此时会自动把name首字母大写并加上get前缀,一旦找 ...

  8. 【JSP EL】<c:if> <c:foreach >EL表达式 获取list长度/不用循环,EL在List中直接获取第一项的内容/EL获取Map的键,Map的值

    1.EL表达式 获取list长度 <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" ...

  9. jsp页面之间传参用el表达式获取

    jsp页面之间传参用el表达式获取 参数方法:${param.参数名} session方法:${session.变量名}

随机推荐

  1. oracle 查看16进制

    DUMP function is useful for this purpose. SQL> select dump(C1) from test; DUMP(C1)--------------- ...

  2. [NOIP2017]时间复杂度(模拟)

    sscanf读入数字,getline(cin,string)读一整行,其余暴力模拟即可. #include<cstdio> #include<string> #include& ...

  3. [NOI2016]循环之美(杜教筛)

    首先要求每个数互不相等,故有$x\perp y$. 可以发现$\frac{x}{y}$在$k$进制下为纯循环小数的充要条件为$x\cdot k^{len}\equiv x(mod\ y)$,即$y\p ...

  4. 【模拟】 Codeforces Round #434 (Div. 1, based on Technocup 2018 Elimination Round 1) C. Tests Renumeration

    题意:有一堆数据,某些是样例数据(假设X个),某些是大数据(假设Y个),但这些数据文件的命名非常混乱.要你给它们一个一个地重命名,保证任意时刻没有重名文件的前提之下,使得样例数据命名为1~X,大数据命 ...

  5. 【递推】【DFS】【枚举】Gym - 101246C - Explode 'Em All

    网格里放了一些石块,一个炸弹能炸开其所在的行和列.问炸光石块至少要几个炸弹. 枚举不炸开的行数,则可以得出还要炸开几列. 为了不让复杂度爆炸,需要两个优化. 先是递推预处理出f(i)表示i的二进制位中 ...

  6. 【动态规划】POJ3280- Cheapest Palindrome

    [题目大意] 给出一个字符串,可以删除或添加一些字符,它们各自会消耗价值.问最少消耗多少价值,可以使得字符串变成回文的. [思路] 事实上删除或添加字符的价值只需要保持较小的那一个.假设当前要将(j, ...

  7. java中interface的完整表述

    我用一个工具:java Decompiler反编译工具查看jar包源码的时候,出现了以下代码: public abstract interface AbsITest{} 在网上搜索了一下: 我对这种情 ...

  8. HDU 4417 Super Mario(划分树)

    Super Mario Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total ...

  9. Win32 error code message

    http://fit.c2.com/fit/files/LispPlatform/lisp/clisp-2.28/src/errwin32.d # Calls a function, passing ...

  10. VS2010 C++ 创建COM组件

    1.项目中要使用到com组件,于是了解了一下com,并根据<C#高级编程>中关于com的介绍用vs创建了一下com,用于实验.以下均根据书中的demo做一遍,熟悉一下而已. 2.创建CoM ...