db값을 2중 selectBox 값에 넣기

ajax로 select box 안에 들어갈 값을 불렀습니다.

jvar userid='<s:authentication property="principal.username"/>';
     var myjob; 
      $.ajax({
         type: "POST",    
         url: "/job/myjob",
         data : {userid : userid},
         success: function(data){
             if(data!=null){
                 alert("일단 값은 들어왔어");
                 myjob=data;
             }else{
                 alert("안들어왔어");
             }
        
             
             for(var i =0; i<data.length; i++){
                // alert(data[i].PROJECT_TITLE+":"+data[i].PROJECT_NICKNAME);
                 $("#project_title").append("<option id="+"selectTitle("+i+")"+" value="+data[i].PROJECT_NICKNAME+" data-value="+data[i].PROJECT_NICKNAME+">"+data[i].PROJECT_TITLE+"</option>");
                 
                // $("#project_nickname").append("<option value="+data[i].PROJECT_NICKNAME+">"+data[i].PROJECT_NICKNAME+"</option>");
             }
             
             
         }
          
     });   

 

해당 컨트롤러 에서 받아서 json타입으로 변환 시켜줍니다.(Java to JSON)

    @RequestMapping(value="/myjob", method=RequestMethod.POST)
    @ResponseBody
    public List<HashMap<String,Object>> myjob(String userid,CriteriaVO cri){
        JSONArray jsonArr= new JSONArray();
    
        //System.out.println("============job/myjob post 방식==============");
        //System.out.println(userid);
        List<HashMap<String,Object>> vo=jobService.getMyJobById(userid);
        //System.out.println("post 컨트롤러에서 일단 데이터 출력: "+vo);
        
        for(HashMap<String,Object>map: vo){
            jsonArr.add(convertMapToJson(map));
        }
        //System.out.println("json 배열 출력: "+jsonArr);    
        
        return jsonArr;
    }
    
    //Map to JSON 변환 함수
    public static JSONObject convertMapToJson(HashMap<String,Object> map){
        
        JSONObject json = new JSONObject();
        for(Map.Entry<String, Object>entry:map.entrySet()){
            String key = entry.getKey();
            Object value = entry.getValue();
            json.put(key, value);
        }
        return json;
    }

<div class="selects" style="width: 300px">
    <select class="project_title" name="type" id="project_title" >
    <option value="all" data-value="all">전체</option>
</div>
 
<div class="selects" style="width: 300px">
    <select class="project_nickname" name="" id="project_nickname">
                                    
    </select>
</div>
                            

JS

//첫번째 셀렉트 박스 눌렀을때 두번째 셀렉트 박스 자동으로 기입 시작===========================================
$("#project_title").on("click",function(e){
    e.preventDefault();
    //var test = $(this).val();
    var test= $(this).find(':selected').attr('data-value');
    //alert("나오니?:"+test);
    $("#project_nickname").empty();
    $("#project_nickname").append("<option>"+test+"</option>");    
    
});//첫번째 셀렉트 박스 눌렀을때 두번째 셀렉트 박스 자동으로 기입 끝=========================================