Add row containing dropdownlist
Jayasri kurra
Greenhorn
Posts: 9
posted 3 years ago
What do you have so far? Were you able to put the data for the drop down in a request attribute?
If so, the next step is to try write a loop that goes through the data. Look at the c:forEach tag to do this. Once you've done that, you can add the code to output <option> for each value.
Which of these steps are you stuck on?
If so, the next step is to try write a loop that goes through the data. Look at the c:forEach tag to do this. Once you've done that, you can add the code to output <option> for each value.
Which of these steps are you stuck on?
[OCA 8 book] [OCP 8 book] [Practice tests book] [Blog] [JavaRanch FAQ] [How To Ask Questions] [Book Promos]
Other Certs: SCEA Part 1, Part 2 & 3, Core Spring 3, TOGAF part 1 and part 2
Jayasri kurra
Greenhorn
Posts: 9
posted 3 years ago
Here is the code
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>
<html>
<head>
<title> Add/Remove dynamic rows in HTML table </title>
<script language="javascript">
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement( '<select><option>' + item+ '</option></select>');
cell1.appendChild(element1);
}
</script>
</head>
<body>
<input type="button" value="Add Row" onclick="addRow('dataTable')" />
<input type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
<table id="dataTable" border="1">
<tr>
<td valign="top">
<select NAME="choice" SIZE="5" width="20">
<c:forEach var="item" items="${list}">
<option>
<c:out value="${item}" />
</option>
</c:forEach>
</select>
</td>
</tr>
</table>
</body>
</html>
This is what I did so far.
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>
<html>
<head>
<title> Add/Remove dynamic rows in HTML table </title>
<script language="javascript">
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement( '<select><option>' + item+ '</option></select>');
cell1.appendChild(element1);
}
</script>
</head>
<body>
<input type="button" value="Add Row" onclick="addRow('dataTable')" />
<input type="button" value="Delete Row" onclick="deleteRow('dataTable')" />
<table id="dataTable" border="1">
<tr>
<td valign="top">
<select NAME="choice" SIZE="5" width="20">
<c:forEach var="item" items="${list}">
<option>
<c:out value="${item}" />
</option>
</c:forEach>
</select>
</td>
</tr>
</table>
</body>
</html>
This is what I did so far.
posted 3 years ago
This looks good. Does it do what you expect? You might want to add a value attribute to option.
[OCA 8 book] [OCP 8 book] [Practice tests book] [Blog] [JavaRanch FAQ] [How To Ask Questions] [Book Promos]
Other Certs: SCEA Part 1, Part 2 & 3, Core Spring 3, TOGAF part 1 and part 2
Paul Ngom
Ranch Hand
Posts: 355
1
posted 3 years ago
Jayasri,
Can you hard code in 2 different html pages what you expect the javascript methods(addRow et deleteRow) to achieve? Please try that and post them. That way, it will be easier to work towards the solution.
Can you hard code in 2 different html pages what you expect the javascript methods(addRow et deleteRow) to achieve? Please try that and post them. That way, it will be easier to work towards the solution.
I am always surprised at the added knowledge i can get from others when i give my opinion on a topic.
