onload = init;
//var state;
var result;
var result2;

function init() {
//	state = $('state');
	result = $('result');
	result2 = $('result2');
	makerDisp();
	carlistDisp()
}

function makerDisp() {
    $('selectMaker').onchange = function (){makerChange(this);}
}

function makerChange(obj) {
  var carCode = Number(obj.value);

  if (carCode == "") {
//    state.innerHTML = "メーカーが選択されていません。<br />\n";
  } else {
    var makerName = obj.options[obj.selectedIndex].text;
//    state.innerHTML = carCode + "：" + makerName + " を選択しました。<br />\n";
    //車名をクリア
    clearCarlist();
    //車名を表示
    carlistDisp(carCode);
  }

}

function carlistDisp(carCode) {
//  state.innerHTML = "処理中です・・・<br />\n";
  var url = "/php/setCarlist.php";
  var paramList = "carCode=" + carCode;

  new Ajax.Request(url,
    {
      method: 'get',
      onSuccess: getData,
      onFailure: showErrMsg,
      parameters: paramList
  });

  function getData(data){
    var response = data.responseXML.getElementsByTagName('Response');
    var item = response[0].getElementsByTagName('Item');

    //select作成
    var sel = $('selectCarlist');

    //1行目のオプション
    var opt = document.createElement('option');
    opt.setAttribute('value', 0);
    var text = document.createTextNode('設定なし');
    opt.appendChild(text);
    sel.appendChild(opt);

    //2行目以降のオプション
    for(i = 0; i < item.length; i++){
      var carCd = item[i].getElementsByTagName('CAR_CD');
      var carCdValue = carCd[0].firstChild.nodeValue;

      var carnamelistName = item[i].getElementsByTagName('CARNAMELIST_HNAME');
      var carnamelistNameValue = carnamelistName[0].firstChild.nodeValue;

      var opt = document.createElement('option');
      opt.setAttribute('value', carCdValue);
      var text = document.createTextNode(carnamelistNameValue);
      opt.appendChild(text);
      sel.appendChild(opt);

    }

    //selectをselectCarlist要素に追加
    selectCarlist.appendChild(sel);
    //イベントハンドラの設定
    $('selectCarlist').onchange = function (){carnamelistChange(this);}
//    state.innerHTML = "データを取得しました。<br />\n";
  }

  function showErrMsg(){
    clearDisp();
//    state.innerHTML = "データを取得できませんでした。<br />\n";
  }

}

function carnamelistChange(obj) {
  var carCd = Number(obj.value);

  if (carCd == 0) {
//    state.innerHTML = "車種が選択されていません。<br />\n";
  } else {
    var carnamelistName = obj.options[obj.selectedIndex].text;
//    state.innerHTML = carCd + "：" + carnamelistName + " を選択しました。<br />\n";
  }

}

function clearCarlist() {
  //selectCarlistの子要素を取得
  var sel = document.getElementById('selectCarlist');
  while ( sel.hasChildNodes() ) {
    sel.removeChild(sel.firstChild);
  }
}