highcharts click事件獲取資料傳給datagrid ，動態載入資料

點選highcharts的柱子會觸發click事件，並將資料傳給後臺獲取到相應部門下的所有員工資訊顯示在datagrid

如下：新增在charts的初始化裡

[java] view plain copy

plotOptions : {
series : {
cursor : 'pointer',
events : {
click : function(e) {
var value=e.point.id;
location.href ="user/showTable.shtml?id="

+value;
}
}
},

這裡的e.point.id 是我再後臺返回json資料時在jsonobject新增的，表明了部門的id編號，這樣後臺就可以根據id獲取該部門下的使用者

在後臺，json資料裡獲取到了一些value，會顯示上一篇的效果。

[java] view plain copy

@RequestMapping(value="/getChartsJson" ,produces = "text/html;charset=UTF-8")
@ResponseBody
public String getJson() {
/*
JSONObject params = new JSONObject();
params.put("name", deptService.getDeptname());
params.put("count", userService.getDeptCountList());
*/
List<Integer> listcount=userService.getDeptCountList();
List<String> listname=deptService.getDeptname();
List<Integer> listdeptid=deptService.getDeptid();
JSONArray jsonarray=new JSONArray();
for(int i=0;i<listcount.size();i++){
JSONObject params = new JSONObject();
params.put("name", listname.get(i));
params.put("count", listcount.get(i) );
params.put("id", listdeptid.get(i) );
jsonarray.add(i,params );
}
JSONObject json = new JSONObject();
json.put("list", jsonarray);
String s=json.toString();
return s;
}

再點選柱子後會調到後臺，目的是將我們獲取到該柱子所表示的部門id值傳入到要顯示datagrid的jsp中（這裡傳入到了table.jsp中）

[java] view plain copy

@RequestMapping("/showTable")
public ModelAndView showTable(Integer id) throws Exception {
ModelAndView mav = new ModelAndView("table");
mav.addObject("id", id);
return mav;
}

table.jsp

[html] view plain copy

<%@ page language="java" import="java.util.*" pageEncoding="GB18030"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>員工管理</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="jquery-easyui-1.4.4/jquery.min.js"></script>
<script type="text/javascript"
src="jquery-easyui-1.4.4/jquery.easyui.min.js"></script>
<script type="text/javascript" src="jquery-form.js"></script>
<link href="jquery-easyui-1.4.4/themes/default/easyui.css"
rel="stylesheet" type="text/css" />
<link href="jquery-easyui-1.4.4/themes/icon.css" rel="stylesheet"
type="text/css" />
<link href="css/userdlg.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function () {
$('#dgg').datagrid({
// url:"user/showUser.shtml",
//url:"user/showPageUser.shtml",
url : "user/getUserByDeptno.shtml?id=" + ${id},
columns : [ [ {
field : 'id',
title : '編號',
align : 'center',
width : 60
}, {
field : 'userName',
title : '使用者名稱',
align : 'center',
width : 60
}, {
field : 'age',
title : '年齡',
width : 60,
align : 'center'
}, {
field : 'position',
title : '職位',
width : 60,
align : 'center'
}, {
field : 'sex',
title : '性別',
width : 60,
align : 'center'
}, {
field : 'deptno',
title : '部門編號',
width : 60,
height:60,
align : 'center'
} ] ]
});
var p = $("#dgg").datagrid("getPager");
$(p).pagination({
pageSize : 10,// 每頁顯示的記錄條數，預設為10
pageList : [ 5, 10, 15 ],// 可以設定每頁記錄條數的列表
beforePageText : '第',// 頁數文字框前顯示的漢字
afterPageText : '頁共 {pages} 頁',
displayMsg : '當前顯示 {from} - {to} 條記錄共 {total} 條記錄',
});
});
</script>
</head>
相關推薦

highcharts click事件獲取資料傳給datagrid ，動態載入資料

點選highcharts的柱子會觸發click事件，並將資料傳給後臺獲取到相應部門下的所有員工資訊顯示在datagrid 如下：新增在charts的初始化裡 [java] view plain copy

後端將Long型別的資料傳給前端，前端可能會出現精度丟失的情況及其解決方案

1.問題描述: 後端將long型別資料傳給前端,前端解析時可能出現精度丟失的情況. 例如:後端資料:919059760869863424,到前端變成919059760869863400;又或如:918806410454654976--->918806410454654900表現為

前臺通過js 寫個ajax請求把資料傳給後臺，然後後臺接收到這個資料，再儲存到資料庫。。

//前端js操作： function testAjax(){ var url="/testAjaxUrlJson/";//後臺接收處理url var txtContent= "textprm";//傳輸內容; var objData = [ { name

在webcontent中新建的資料夾中建立的JSP無法將資料傳給servlet

   相信很多寫程式的朋友都會建立很多資料夾來分類存放所寫的程式碼，本人也是如此，但是作為一個菜鳥，在做這件事的時候總會發生許多錯誤，我也一一記錄下來，今次也不例外。    在寫一個關於登入頁面的簡單的JSP+Servlet時，新建立的資料夾，在裡面新寫

jquery 一個form的資料傳給另一個form

將form資料序列化js物件js程式碼 // 將一個表單的資料返回成JS物件 $.fn.serializeObject = function() { var o =

vue父元件調子元件 $refs （把父元件的資料傳給子元件）

父元件： <el-dialog title="" @close="refresh" :visible.sync="userRoleVisible" @open="showAuthEvent"> <user-role-panel ref="authP

vue---父調子 $refs （把父元件的資料傳給子元件）子調父 $emit (把子元件的資料傳給父元件)

ps:App.vue 父元件　 Hello.vue 子元件 App.vue : <template> <div id="app"> <input type="

通過Json格式將資料傳給服務端

1、匯入json相關的jar包，一共是6個，如果有需要jar包的歡迎大傢俬聊我！ 2、在繼承HttpServlet類下面的doGet（）方法中寫如下的程式 request.setCharacterEncoding("utf-8");resp

大資料量JSONObject.fromObject效能問題（大資料傳給前臺）

最近專案中我負責了一個jms列印log資訊的功能模組。大體需求是，用jms接受log資訊，然後前臺請求的時候，發給前臺最新的log資訊，前臺會不斷的重新整理獲取資料。個人思路是寫一個靜態的固定長度的list儲存log資訊，如果list滿了清空。前臺第一次訪問的時候，返回給

opencv將影象轉換成二維陣列再將陣列資料傳給新影象

#include<iostream> #include<fstream> #include "cv.h" #include "highgui.h" using namespac

php的老兄傳給客戶端[object object]資料如何解析，但他堅稱是json...

一般伺服器傳給客戶端的資料格式是json 。然後這個是js觸發之後，伺服器傳過來的，據說沒有jsonformat。。。。然後就是這個東東：直接列印或者強轉並不行，需要轉成dictionary來解析，toDictionary 這個方法是是Frameworks中的：Ja

ajax動態載入資料後的click事件問題

問：為什麼ajax加載出來的html,無法用選擇器繫結事件,但可以直接在html上使用onclick等事件? 如ajax 載入了<div class="div">div</div> 然後$('.div').click(funct

使用HttpRequest.Files 獲取上傳文件，實現上傳附件功能

post 分享 new 失敗 light 查看 continue 存在 nbsp 使用HttpRequest.Files 獲取上傳文件，實現上傳附件功能，不同瀏覽器會有差異：獲得在 Google 瀏覽器上傳後得到的 HttpRequest.Files (客戶端上載文件

在asp.net mvc3 中，在controller中使用HttpPostedFileBase file 引數獲取上傳的檔案，檔案路徑問題

轉載：https://zhidao.baidu.com/question/444203596.html 在asp.net mvc3 中，在controller中使用HttpPostedFileBase file 引數獲取上傳的檔案，開始的時候file.filename獲取的為檔案的名稱，後來

移動端將base64傳給後臺，後臺解析出的圖片一部分是白色的

1、base64在手機端如果儲存到input的value裡面   input會截斷太大的部分導致後臺收到的base64無法正確解析或者一部分是白色的   可以放到全域性變數或者imgsrc屬性裡 2、部

datagrid動態載入資料分頁下載EasyUI外掛

這是完整的前臺程式碼 <!DOCTYPE html> <html> <head id="Head1"> <title>StencilControl</title> <script src="/

Vue2.0父元件向子元件傳值，動態修改資料問題[props導致的問題]

在Vue2.0中，專案開發時遇到的問題。在子元件定義 <script> export default { props:['displaySelf'] } </script>

$.ajax()前臺資料傳至後臺，中文亂碼問題

原因：對於在網路中傳輸的字元資料，不管其編碼為什麼，java總認為是“iso-8859-1”編碼，所以從前臺取到的資料如此處理：content = new String(前臺資料.getBytes("iso-8859-1"),"utf-8");//utf-8可以換成你程式設

Jquery chosen動態設定值 select Ajax動態載入資料設定chosen和獲取他們選中的值

在做一個編輯對話方塊時，要對裡面帶有select option的操作。主要是想動態載入option和對option的選中。但是由於專案中使用了jquery裡的chosen()方法，怎麼也無法實現效果。原碼如下： Java程式碼 <select id="viewOLanguage"

Delegate 類概念與MVC模式不同，model/view結構沒有用於與使用者互動的完全獨立的元件。一般來講， view負責把資料展示給使用者，也處理使用者的輸入。為了獲得更多的靈性性，互動通過d

Delegate  類概念與MVC模式不同，model/view結構沒有用於與使用者互動的完全獨立的元件。一般來講， view負責把資料展示給使用者，也處理使用者的輸入。為了獲得更多的靈性性，互動通過delegagte執行。它既提供輸入功能又負責渲染view中的每個

highcharts click事件獲取資料傳給datagrid ，動態載入資料

相關推薦