动态选择下拉框返回null或未定义

Question

我试图在我的网页中实现一个下拉框，其中列出了数据库中值的选项。我已经实现了显示下拉菜单列出的选项，但是当我选择该选项时，它没有设置为一个值。换句话说，我怀疑我的下拉菜单是否已初始化。

我已添加了操作所需的代码段。

function add_row() {
  table = document.getElementById('b_book');
  var rowData = document.createElement('tr');
  rowData.innerHTML = '<td>' + slno +
    '</td><td id="dbSNO"><select id="SNO[' + slno + ']" onchange="detail_fetcher(this.value)" onselect="detail_fetcher(this.value)" onload="detail_fetcher(this.value)"></select></td>' +
    '<td id="dbLNO"><input type="text" id="LNO[' + slno + ']" list="lot_srch_list" onkeydown="LNO_COL(event,this.value,this.id)" onfocus="lotNo_select()"/></td>' +
    '<td><input type="text" id="dbMTR[' + slno + ']"/></td><td id="dbWT[' + slno + ']"></td><td id="dbMWT[' + slno + ']"></td><td id="GPM[' + slno + ']"></td><td id="dbTONE[' + slno + ']"></td><td><button id="btn_rem[' + slno + ']" onclick="remove_row()">Remove</button></td>';
  table.appendChild(rowData);
  slno += 1;
}

function LNO_COL(e, lno, hashtag) {
  var beg_pos = hashtag.indexOf('[') + 1;
  var end_pos = hashtag.indexOf(']');
  var hash_pos = hashtag.substring(hashtag.lastIndexOf('[') + 1, hashtag.lastIndexOf(']'));
  var postIN = 'par=' + parname.value + '&lno=' + lno;
  if (e.ctrlKey) {
    sNo_list = document.getElementById('SNO[' + hash_pos + ']');
    sNo_list.innerHTML = '';
    var XMLhLNO = new XMLHttpRequest();
    XMLhLNO.onreadystatechange = function () {
      if ((this.readyState === 4) && (this.status === 200)) {
        var result = this.responseText;
        var JSON_result = JSON.parse(result);
        for (z in JSON_result) {
          var sno_opt;
          sno_opt = document.createElement('option');
          sno_opt.value = JSON_result[z].slno;
          sno_opt.text = JSON_result[z].slno;
          sNo_list.appendChild(sno_opt);
        }
      }
    };
    XMLhLNO.open('POST', 'sno_lot_par2.php', true);
    XMLhLNO.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
    XMLhLNO.send(postIN);
    detail_fetcher(hashtag);
  }
}

function detail_fetcher(hash_position) {
  var row_no = hash_position.substring(hash_position.lastIndexOf('[') + 1, hash_position.lastIndexOf(']'));
  var serial_row = document.getElementById('SNO[' + row_no + ']');
  alert(serial_row.);
/*              var XMLfetcher  =   new XMLHttpRequest();
    XMLfetcher.onreadystatechange   =   function()
    {
        if((this.readyState ==  4)&&(this.status    ==  200))
        {
            var src_result  =   this.responseText;
            var JSON_res    =   JSON.parse(src_result);
            alert(serial_row_db);
            alert(src_result);
        }
    };
    XMLfetcher.open('POST','srch_lot2.php',true);
    XMLfetcher.setRequestHeader('Content-type','application/x-www-form-urlencoded');
    XMLfetcher.send(('row=' + serial_row_db));
*/          
}

我尝试使用值方法，selecteditem(index)方法，但没有一个被证明是成功的。

注意：我想使用纯JavaScript，因为我对使用jQuery非常困惑。