Javascript 如何将元素数组放入表单而不是手动？

如何从从数据库检索的项目数组中生成表单，并将这些元素中的每一个元素放入表单中

现在我无法使项目显示在表单中。它是空的

这是我正在尝试的，但没有运气

Js文件：

  function input(items) {
    var arr = [];
      for (var i = 0; i < this.state.items.length; i++) {
        arr.push(this.state.items[i].name)
      }
      arr.forEach(function(item) {
        var source = document.getElementById("cowNames[]")
        var option = document.createElement("option");
        option.text = item;
        source.append(option, source[0])
    });
  };

      <form name="submit" onSubmit={this.handleSubmit}>
        <label>
          Find Item:
          <select>
            <option id="cowNames[]" className="items">
            </option>
          </select>
        </label>
        <input type="submit" value="View Info" />
      </form>

功能输入（项目）{
var-arr=[]；
对于（var i=0；i

Html：

  function input(items) {
    var arr = [];
      for (var i = 0; i < this.state.items.length; i++) {
        arr.push(this.state.items[i].name)
      }
      arr.forEach(function(item) {
        var source = document.getElementById("cowNames[]")
        var option = document.createElement("option");
        option.text = item;
        source.append(option, source[0])
    });
  };

      <form name="submit" onSubmit={this.handleSubmit}>
        <label>
          Find Item:
          <select>
            <option id="cowNames[]" className="items">
            </option>
          </select>
        </label>
        <input type="submit" value="View Info" />
      </form>

查找项目：

---

总之，我想这样做，但是显示已经从数据库检索到的表单选项，而不必手动添加它们。

您需要将选项附加到

元素。例如

var arr=['dexter'，'aberdeen'，'hereford']
arr.forEach（功能（项目）{
var source=document.getElementById（“cowNames[]”）
var option=document.createElement（“选项”）；
option.classList.add（“项”）；
option.text=项目；
source.append（选项，源[0]）
})

查找项目：

每个

都需要附加到

元素中。React中更惯用的解决方案是：

// Assuming `optionsArr` contains your option values
<form name="submit" onSubmit={this.handleSubmit}>
  <label>
    Find Item:
    <select>
      {optionsArr.map((optionName) => (
        <option value={optionName}>{optionName}</option>
      ))}
    </select>
  </label>
  <input type="submit" value="View Info" />
</form>

//假设'optionsArr'包含您的选项值
查找项目：
{optionsArr.map（（optionName）=>(
{optionName}
))}

您正在使用React吗？如果是，你能添加整个组件吗？我想说的是，如果OP使用React，这可以用更好的方式完成way@RameshReddy为什么不发布另一个答案？我不是react用户，所以我想了解如何更好…在这种情况下，我们不需要查询元素。看朱利奥马尔夫斯的回答。@Rameshredy，谢谢，这很好！是的，这很有效！非常感谢你！偏头痛已经消失了。