简体   繁体   中英

How can I put a drop down menu in a table using Javascript?

I want to create a table of two columns and unspecific rows. In the first column there should only a string, a name or something, but next to it there should be a drop down menu in which I can chose a modification or so. The data comes from a server and the function XY() I want to expand the table constructed in the <body> area, but everything I tried, putting the drop down field as the cell2 failed.

Code:

<html>
<head>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script src="datajs-1.0.2.min.js"></script>

<script type="text/javascript">

function readCustomerSuccessCallback(data, response) {

     var customerTable = document.getElementById("CustomerTable");
        for (var i = 0; i < data.results.length; i++) {
            var row = customerTable.insertRow(1);
            var cell1 = row.insertCell(0);
            var cell2 = row.insertCell(1);
            cell1.innerHTML = data.results[i].CUSTOMER_NAME;
        cell2.innerHTML = '<a href="javascript:void(0);" onclick="readProducts(' + data.results[i].STATION_ID + ')">' + "all_data" + '</a>';


        }
    }
</script>

</head>
<body>
<table id="CustomerTable">
            <thead>
            <tr>
                <th>Customer</th>
                <th>Filter the Data</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>EXAMPLE</td>
                <td class="dropdown">
                    <form action="" name="FILTER">
                        <select name="filter_for" >
                            <option value="Druck">Druck</option>
                            <option value="Zahl">Zahl</option>
                            <option value="Temperatur">Temperatur</option>
                            <option value="Drehzahl">Drehzahl</option>
                            <option value="andere">andere</option>
                        </select>
                    </form>
                </td>
            </tr>
            </tbody>
        </table>
</body>

At this moment there is only a Link in the cell2, but I want to put a drop down menu there.

using Bootstrap dropdown menu . that is very useful . http://www.w3schools.com/bootstrap/bootstrap_dropdowns.asp

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM