[Spring / JSON / SQL] 다중행 SQL을 JSONArray에 담아 jsp에 parse 후 출력하기.

리트리버J

·

2020. 11. 7. 09:06

728x90

0. Spring에서 JSON을 사용해주기 위해, pom.xml에 dependency를 추가해준다.


1
2
3
4
5
6
7
8
<!-- https://mvnrepository.com/artifact/net.sf.json-lib/json-lib -->
<dependency>
    <groupId>net.sf.json-lib</groupId>
    <artifactId>json-lib</artifactId>
    <version>2.4</version>
    
    <classifier>jdk15</classifier>
</dependency>
cs


1. Controller


다중행을 담을 수 있게 List와 <제네릭스>에 담을 객체를 적어준다.

그 후, 다중행을 가져와 JSONARRAY객체의 fromObject메소드를 이용하여 List인스턴스를 파라미터로 담아준다.

JSONArray : JSONObject / String 등을 담을 수 있다.

fromObject() : 파라미터로 전달받은 객체를 JSONArray객체로 만들 수 있다. 

1
2
3
4
5
6
7
8
9
@RequestMapping(value = "productInsertPage.do" , method = RequestMethod.GET)
public String getGoodsRegister(Model model, HttpSession session){
    
       List<ProductCategory> category = pService.category();
 
       model.addAttribute("category", JSONArray.fromObject(category));
 
       return "user/product/productInsert";
}
cs

 2. category를 출력하면 다음과 같다. List<>의 출력값이다.


[ ProductCategory [cateName=웹개발, cateCode=10, cateCodeRef=null, level=1], ProductCategory [cateName=개발언어, cateCode=210, cateCodeRef=10, level=2], ProductCategory [cateName=Java·JSP, cateCode=501, cateCodeRef=210, level=3], ProductCategory [cateName=XML, cateCode=502, cateCodeRef=210, level=3], ProductCategory [cateName=NET, cateCode=503, cateCodeRef=210, level=3], ProductCategory [cateName=Ajax, cateCode=504, cateCodeRef=210, level=3], ProductCategory [cateName=Ruby, cateCode=505, cateCodeRef=210, level=3], ProductCategory [cateName=ASP, cateCode=506, cateCodeRef=210, level=3], ProductCategory [cateName=PHP, cateCode=507, cateCodeRef=210, level=3],

.................................................................................................................................................................... ,

ProductCategory [cateName=Windows, cateCode=746, cateCodeRef=390, level=3] ]


 3. JSONArray.fromObject(category)를 출력하면 다음과 같다. JSONArray의 출력값이다.


[{"cateCode":"10","cateCodeRef":"","cateName":"웹개발","level":1},{"cateCode":"210","cateCodeRef":"10","cateName":"개발언어","level":2},{"cateCode":"501","cateCodeRef":"210","cateName":"Java·JSP","level":3},{"cateCode":"502","cateCodeRef":"210","cateName":"XML","level":3},{"cateCode":"503","cateCodeRef":"210","cateName":"NET","level":3},{"cateCode":"504","cateCodeRef":"210","cateName":"Ajax","level":3},{"cateCode":"505","cateCodeRef":"210","cateName":"Ruby","level":3},{"cateCode":"506","cateCodeRef":"210","cateName":"ASP","level":3},{"cateCode":"507","cateCodeRef":"210","cateName":"PHP","level":3},{"cateCode":"508","cateCodeRef":"210","cateName":"HTML","level":3},{"cateCode":"509","cateCodeRef":"210","cateName":"APM","level":3},{"cateCode":"510","cateCodeRef":"210","cateName":"PERL","level":3},{"cateCode":"511","cateCodeRef":"210","cateName":"Python","level":3},{"cateCode":"512","cateCodeRef":"210","cateName":"Node.js","level":3},{"cateCode":"513","cateCodeRef":"210","cateName":"C#","level":3},{"cateCode":"514","cateCodeRef":"210","cateName":"CSS","level":3},{"cateCode":"515","cateCodeRef":"210","cateName":"jQuery","level":3},{"cateCode":"516","cateCodeRef":"210","cateName":"Servlet","level":3},{"cateCode":"517","cateCodeRef":"210","cateName":"JavaScript","level":3},{"cateCode":"518","cateCodeRef":"210","cateName":"Go","level":3},

.................................................................................................................................................................... ,

{"cateCode":"743","cateCodeRef":"390","cateName":"Linux","level":3},{"cateCode":"744","cateCodeRef":"390","cateName":"macOS","level":3},{"cateCode":"745","cateCodeRef":"390","cateName":"Unix","level":3},{"cateCode":"746","cateCodeRef":"390","cateName":"Windows","level":3}]


 4. jsp에서 JSON객체를 분석하기.

Controller에서 model.addAttribute()로 담아준 category변수를 el태그에 ${'변수명'}

넣어 JSON.parse의 파라미터로 넣어주면, JSON객체를 분석하여 들고온다.


1
2
3
var jsonData = JSON.parse('${category}');
console.log(jsonData);
console.log(jsonData.length);
cs


jsonData는 key : value로 가져오게 되며,
key값은 배열의 index로, value는 Object형태로 가져오게 된다. 


 5. JSON객체를 일반 객체 / 배열로 담아주기. 

1
2
3
4
5
6
7
8
9
10
11
12
var cate1Arr = new Array();
var cate1Obj = new Object();
 
for(var i = 0; i < jsonData.length; i++) {
 
 if(jsonData[i].level == "1") {
  cate1Obj = new Object();  //초기화
  cate1Obj.cateCode = jsonData[i].cateCode;
  cate1Obj.cateName = jsonData[i].cateName;
  cate1Arr.push(cate1Obj);
 }
}
cs

 

728x90