Chained Selects Plugin for jQuery and Zepto


코드바인딩

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.chained.remote.min.js"></script>


셀렉트 박스 정의

<select id="mark" name="mark">
  <option value="">--</option>
  <option value="bmw">BMW</option>
  <option value="audi">Audi</option>
</select>
<select id="series" name="series">
  <option value="">--</option>
</select>
<select id="model" name="model">
  <option value="">--</option>
</select>
<select id="engine" name="engine">
  <option value="">--</option>
</select>


원격에서 데이터 가져와 채우기

$("#series").remoteChained({
    parents : "#mark",
    url : "/api/series.json"
});

$("#model").remoteChained({
    parents : "#series",
    url : "/api/model.json"
});

$("#engine").remoteChained({
    parents : "#series, #model",
    url : "/api/engine.json"
});

출처) http://www.appelsiini.net/projects/chained