Struggling with assigning IDs to two elements in a single column - a dropdown and a text element. Managed it in the first scenario, but encountering issues in the second one. Seeking assistance on this matter.
Scenario 1:
<td>
<select name="fmeaEntityForm[0].subSystem.id" id="subSystem0" onchange="getsubSystemFunction(this)">
<option value="-1">
<spring:message code="label.fmea.select.subSystem" />
</option>
<c:forEach items="${subSystemList}" var="ss">
<option value="${ss.id}">${ss.subSystem}</option>
</c:forEach>
<option value="0">
<spring:message code="label.fmea.select.other" /></option>
</select>
<input type="text" name="fmeaEntityForm[0].subSystem.subSystem" id="subSystemText0" placeholder="Enter Sub-system if selected other"/>
</td>
In scenario one i can easily access first element by :
table.rows[rowCount].cells[cellNumber].childNodes[0]
and second element by table.rows[rowCount].cells[cellNumber].lastChild
.
Scenario 2: Required aligning of both the dropdown and text box, so utilized two classes for parallel alignment. Successfully aligned them, but having trouble accessing both elements.
<td>
<div class="element1">
<select name="fmeaEntityForm[0].subSystem.id" id="subSystem0" onchange="getsubSystemFunction(this)">
<option value="-1">
<spring:message code="label.fmea.select.subSystem" />
</option>
<c:forEach items="${subSystemList}" var="ss">
<option value="${ss.id}">${ss.subSystem}</option>
</c:forEach>
<option value="0">
<spring:message code="label.fmea.select.other" />
</option>
</select>
</div>
<div class="element2">
<input type="text" name="fmeaEntityForm[0].subSystem.subSystem" id="subSystemText0" placeholder="Enter Sub-system if selected other"/>
</div>
</td>
CSS
.element1
{
display:inline;
float:left;
}
.element2
{
margin-left:5px;
display:inline;
float:left;
}