动态创建下拉菜单 - Javascript [英] Creating Dropdown Dynamically - Javascript

查看:93
本文介绍了动态创建下拉菜单 - Javascript的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试开发一个JS函数,每次将新记录添加到数据库(从定期检查的不同程序)中创建一个新行。现在我可以得到函数来检查db,将记录添加到表中并动态显示。第一列是用户ID,第二列是我遇到的问题。我想包括一个下拉列表,但我不知道如何添加选项。我在第二列中有下拉列表,但没有选项可供选择。任何人都有一些建议?

I'm trying to develop a JS function that creates a new row each time a new record is added to a database (from a different program that checks periodically). Right now I can get the function to check the db, add the record to the table and display it dynamically. The first column is the user id and the second column is where I'm running into issues. I would like to include a dropdown, but I'm not sure how to add options to it. I have the dropdown in the second column, but there are no options to choose from. Anyone have some suggestions?

function addRow(tableID, user) {

var table = document.getElementById(tableID);

var rowCount = table.rows.length;
var row = table.insertRow(rowCount);

var colCount = table.rows[0].cells.length;

for(var i=0; i<colCount; i++) {
    var opt = document.createElement("option");

     tabbody=document.getElementsByTagName("tbody").item(2);
     cell1 = document.createElement("TD");
     cell2 = document.createElement("TD");
     textnode1=document.createTextNode(user);
     //textnode2=document.createTextNode("morecontent");
     textnode2=document.createElement("select");
     textnode2.setAttribute('id', 'focus');
     textnode2.options.add(opt);
     cell1.appendChild(textnode1);
     cell2.appendChild(textnode2);
     row.appendChild(cell1);
     row.appendChild(cell2);
     tabbody.appendChild(row);

    var newcell = row.insertCell(i);

    newcell.innerHTML = table.rows[0].cells[i].innerHTML;

以下是发送给的HTML:

Here is the HTML that it is sent to:

        <th colspan="2">Pending Alerts</th>
    <tr>
       <th>User</th>
       <th>Action</th>
        </tr>
    <tbody>
    </tbody>


推荐答案

textnode2 = document.createElement("select");

您需要执行类似

var op = new Option();
op.value = 1;
op.text = "First entry";
textnode2.options.add(op);      

并重复所需的条目。

这篇关于动态创建下拉菜单 - Javascript的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆