[질답/버그/제안] 지역 다중 셀렉트 사용하는데 수정시 DB저장된 지역이 선택되어 있도록 어떻게 해야할까요?

조용한 새벽에 단잠들 이루고 계신지요 ^^

질문 하나 남깁니다.

글쓰기시 지역 다중 셀렉트박스로 사용중입니다.

서울|서초 이런식으로 저장이 되어 있으며 수정을 하면

셀렉트박스가 selected가 되어 있어야 하는데 잘 안되네요ㅠㅠ

해당 부분 소스는 아래외 같습니다.

$('document').ready(function() {

var area0 = ["시/도","서울","경기","인천","대전","대구","부산","울산","광주","충남","충북","경남","경북","전남","전북","강원","제주"];

var area1 = ["전체","강남","선릉","서초","송파","잠실","강동","동작","관악","금천","영등포","구로","양천","강서","마포","공덕","용산","중구","종로","성동","광진","동대문","중랑","성북","강북","노원","도봉","은평","서대문"];

var area2 = ["전체","파주","고양","일산","김포","부천","시흥","배곧","안산","군포","안양","평촌","과천","광명","의왕","수원","광교","화성","동탄","오산","평택","안성","용인","성남","분당","광주","하남","남양주","의정부","양주","동두천","포천","이천","여주"];

var area3 = ["전체","부평","간석","구월","남동","연수","송도","서구","청라","계양","동구","중구","미추홀","영종도"];

var area4 = ["전체","유성","서구","동구","중구","대덕"];

var area5 = ["전체","달서구","수성","서구","남구","북구","중구","동구","달성"];

var area6 = ["전체","서면","해운대","부산진","수영","연제","동래","사하","사상","강서","금정","남구","동구","북구","서구","중구","기장"];

var area7 = ["전체","남구","동구","북구","중구","울주군"];

var area8 = ["전체","광산구","남구","동구","북구","서구"];

var area9 = ["전체","천안","아산","세종","당진"];

var area9 = ["전체","청주","음성","진천","충주","제천"];

var area10 = ["전체","창원","김해","장유","양산","진주","통영","거제","밀양"];

var area11 = ["전체","구미","김천","안동","영주","경산","경주","포항"];

var area12 = ["전체","여수","순천","광양","목포","나주"];

var area13 = ["전체","전주","익산","군산","김제","정읍"];

var area14 = ["전체","원주","춘천","강릉","속초","삼천"];

var area15 = ["전체","제주시","서귀포"];

// 시/도 선택 박스 초기화

$("select[name^=sido]").each(function() {

$selsido = $(this);

$.each(eval(area0), function() {

$selsido.append(""+this+"");

});

$selsido.next().append("구/군");

});

// 시/도 선택시 구/군 설정

$("select[name^=sido]").change(function() {

var area = "area"+$("option",$(this)).index($("option:selected",$(this))); // 선택지역의 구군 Array

var $gugun = $(this).next(); // 선택영역 군구 객체

$("option",$gugun).remove(); // 구군 초기화

if(area == "area0")

$gugun.append("구/군 선택");

else {

$.each(eval(area), function() {

$gugun.append(""+this+"");

});

}

});

});

$('#sido1').val(<?=$area1[0]?>).prop('selected',true);

$('#gugun1').val('<?=$area1[1]?>').prop('selected',true);

셀렉트박스의 "시" 선택시 "구/군"이 동적으로 바뀌는  작동은 잘 됩니다. 

그런데 문제가 DB저장 이후 수정을 할때

셀렉트박스에 기존 지역들이 선택이 되어 있도록 해야하는데 잘 안되네요ㅠ

insert때는 둘다 선택을 한 후 값이 저장이 되는데

수정페이지에서 DB값을 불러와서 두개의 셀렉트 박스에 해당 지역(시 , 구)가 선택이 되어 있어야 합니다.

위 소스중 잘 못된 부분 좀 체크 해주시면 감사드리겠습니다. ^^