将工作select元素添加到现有表

时间:2014-04-11 13:53:48

标签: javascript createelement

我有一个JavaScript函数,可以向表中添加新行。它可以很好地添加数据类型,如输入(文本),文本框和无线电。它也可以使用

使用document.createElement( '选择');

但是一旦我尝试添加元素,触发JS函数的按钮什么都不做,我认为这意味着有错误,但我没有得到任何问题的迹象。我确定我只是错过了一些简单的东西,但是它让我退了好几个小时,这让我疯了!

函数的主体很好,因为任何其他数据类型都会相应地创建表单元并将其自身添加到表单元格中。 JS在函数中正常工作的示例:

// inner left cell - text input
  var cellTwo = row.insertCell(1);
  var el = document.createElement('input');
  el.type = 'text';
  el.name = 'col' + rowNumber;
  el.id = 'col' + rowNumber;
  cellTwo.appendChild(el);

尝试使用工作选项创建一个select元素的代码:(注意,如果我注释掉选项部分并且只是创建一个空的select元素,那么错误必须在foor循环中的某个地方,并且必须只是一个我误解了如何动态创建选项的结果:

// inner right cell - select box
  var cellThree = row.insertCell(2);
  //create select element
  var dropDown = document.createElement('select');
  //give select element id and name
  dropDown.id = 'fieldtypecol' + rowNumber;
  dropDown.name = 'fieldtypecol' + rowNumber;

  //declare array values to put in option elements
  var optionValue[] = new Array('varchar(255)', 'int', 'date', 'float(53)');
  var optionText[] = new Array('String', 'Integer', 'Date', 'Float');

  //declare option element holder
  var option;

  //loop through creating and adding values to options
  for (var i = 0; i < 4; i++)
    {
    option = document.createElement('option');
    option.value = optionValue[i];
    option.text = optionText[i];
    //append current option before loop restarts
    dropDown.appendChild(option);
    }
  //append select element to new table cell
  cellThree.appendChild(dropDown);

非常感谢任何帮助,谢谢。

1 个答案:

答案 0 :(得分:0)

在您的代码中显示行;

var optionValue[] = new Array('varchar(255)', 'int', 'date', 'float(53)');
var optionText[] = new Array('String', 'Integer', 'Date', 'Float');

应该是;

var optionValue = new Array('varchar(255)', 'int', 'date', 'float(53)');
var optionText = new Array('String', 'Integer', 'Date', 'Float');

JS中的类型是动态的,我认为这些错误会出现在JS控制台中。