요즘 화면 설계하고, 구현하는 것을 하고 있습니다.

상품 카테고리를 1차를 클릭하면 2차가 뜨도록 구현을 했습니다.

위의 사진 3개는 상품을 등록할때 DB의 데이터를 카테고리로 설정할 수 있는 코드입니다.
클릭했을때 나오는 것들은 1차, 2차 카테고리 각각의 테이블에 저장해뒀습니다.

                            <div class="form_section">
                                <div class="form_section_title">
                                    <label>상품 카테고리</label>
                                </div>
                                <div class="form_section_content">
                                    <div class="cate_wrap">
                                        <span>1차 분류</span>
                                        <select class="cate1" name="cateName">
                                            <option value="none">선택</option>
                                                <c:forEach var="cateList" items="${cateList}" varStatus="i">
                                                     <option value="${cateList.cateName}">${cateList.cateName}</option>
                                                </c:forEach>
                                        </select>
                                    </div>
                                    <div class="cate_wrap">
                                        <span>2차 분류</span>
                                        <select class="cate2"  name="cateParent">
                                            <option value="">선택</option>
                                        </select>
                                    </div>
                                 </div>
                            </div><!-- 카테고리 끝-->

          <select class="cate2"  name="cateParent">
                <option value="">선택</option>
          </select>
       </div>
   </div>

    $(".cate1").on("change",function(){                  
             var cate1=$(".cate1").val();             
             var str="";         
             $.getJSON("/admin/"+cate1+".json",    // getJSON 시작
                function(data){                     
                   for(var i=0;i<data.length;i++){                                 
          
                        str+="<option value="+data[i].cateParent+">"+data[i].cateParent+"</option>"
                    }
                     $(".cate2").html(str);
         })// getJSON 끝
        .fail(function(xhr,status,err){// fail 시작
            if(error){
                 error();
             }
         });// fail 끝
    })

아래는 DB에 저장된 상품의 카테고리를 사이트에서 수정하려고 구현중인데, 저장된 부분만 출력되더군요.
그래서 이것저것 건들여봤지만, 상품 등록할때처럼 설정이 안됩니다.

<div class="form_section">
    <div class="form_section_title">
          <label>상품 카테고리</label>
    </div>
        <div class="form_section_content">
             <div class="cate_wrap">
                     <span>1차분류</span>
             <select class="cate1" name="cateName" value="<c:out value="${goodsInfo.cateName}"/>" >
                     <option value="${goodsInfo.cateName}">${goodsInfo.cateName}</option>
             </select>
        </div>
        <div class="cate_wrap">
             <span>2차분류</span>
             <select class="cate2" name="cateCode" value="<c:out value="${goodsInfo.cateParent}"/>" >
                      <option value="${goodsInfo.cateParent}">${goodsInfo.cateParent}</option>                                        </select>
             </div>
         </div>
</div>

상품 수정의 스크립트는 상품등록때와 비슷하게 했는데도 안됩니다.

상품 수정의 카테고리도 상품 등록할때처럼 DB에 저장된 카테고리 테이블의 값을 출력해서,
카테고리 설정을 할 수 있는 방법이 없을까요?

며칠 동안 계속 도전해봐도 어렵습니다.