ajax로 tab 메뉴 구현해야 하는데 도와주세요 ㅠㅠㅠ

Question

탭이 여러개 있고그 탭마다 다른 데이터를 내용으로 보여줘야 합니다.예를 들면, 학급에 1,2,3반 아이들 정보 리스트(이름, 주소, 성적 등등)가 각각 있다고 생각하면1번 탭을 눌렀을때 1반 아이들 정보 리스트2번 탭 눌렀을 때 2반 아이들 정보 리스트이런식으로 가져와서 뿌려줘야 하는데 ajax로 구현해주려 하는데 모르겠어요 ㅠㅠvue하다가 jsp하려니 ,,새로고침 없이 뿌리는 방법은 데이터 새로 가져올때마다 html 지우고 다시 넣어주고 하는 그런 방법밖에 없는건가요? ㅠㅠ 도와주세요.

ShipJH · Answer

대상.innerHtml( HTML TAG ); 탭클릭이벤트에 ajax호출넣어주고 기존 html emtpy 해주고 다시 innerHtml해서 데이터 바인딩하셔서 다시 넣는 방법이 가장 간단할 것 같습니다.

지나가던신입 · Answer

jsp도 가능한 진 모르겠지만,, 저는 테이블 혹은 div태그만 따로 조각내서 html파일을 만들고 이어 붙이는데 이게 도움이 될까요? 같은 양식을 반복해서 쓴다면 (ex. 리뷰, 상품정보) 저는 그냥 이렇게 해서 쓰거든용.. //ajax$.ajax({ url:"/test", data:{"a":"a"}, success:function(data){ $('#...').html(data); } }) //controller@RequestMapping("/test") public ModelAndView test(String a) { ModelAndView mv = new ModelAndView("web/test"); List list= {필요한 list}; return mv; } //조각 html파일

ajax로 tab 메뉴 구현해야 하는데 도와주세요 ㅠㅠㅠ

2개의 답변

#tab 목록