我有一个问题，我从一个文件中使用foreach恢复数据，每行显示一个要编辑的按钮，在窗口中调用一个模态窗口，选择一种标准并显示相应的输入，问题在于，第一行只有，而不是在其他行。
部分代码：
if (sel2.value == "actual") {
document.getElementById("divactual").style.display = "block";
divT=document.getElementById("divnuevo");
divT.style.display = "none";
}
if(sel2.value == "nuevo"){
document.getElementById("divnuevo").style.display = "block";
divT=document.getElementById("divactual");
divT.style.display = "none";
}
if(sel2.value == "vacio"){
document.getElementById("divnuevo").style.display = "none";
divT=document.getElementById("divactual");
divT.style.display = "none";
}
}#divnuevo, #divactual{
display: block;
} <table class="table table-list-search table-striped table-bordered text-table">
<thead>
<tr>
<th class="text-center">Tipo de Regla</th>
<th class="text-center">Nombre Campo</th>
<th class="text-center">Nombre Regla</th>
<th class="text-center">Pos Ini</th>
<th class="text-center">Pos Fin</th>
<th class="text-center">Token</th>
<th class="text-center">Criterio</th>
<th class="text-center">Argumentos</th>
<th class="text-center">Descripción</th>
<th></th>
</tr>
</thead>
<tbody>
<c:choose>
<c:when test="${generals.size()==0}">
<td colspan="11"><h3 class="text-danger">No existen Registros de Reglas Generales en el Archivo</h3> </td>
<br/>
</c:when>
<c:otherwise>
<c:forEach items="${generals}" var="generals">
<tr>
<td>${generals.tipoRegla}</td>
<td>${generals.nomCampo}</td>
<td>${generals.nomRegla}</td>
<td>${generals.posIni}</td>
<td>${generals.posFin}</td>
<td>${generals.token}</td>
<td class="wrap"><p class="test"> ${generals.criterio} </p> </td>
<td class="wrap"><p class="test2">${generals.argumentos} </p> </td>
<td class="wrap"><p class="test"> ${generals.descrip} </p> </td>
<c:set var="salary" scope="session" value="${generals.nomRegla}"/>
<td>
<a role="button"
data-target="#Modificar_${generals.token }_${generals.tipoRegla}_${generals.nomCampo}_${generals.nomRegla}_${generals.posIni}_${generals.posFin}_${generals.criterio}"
class="btn btn-default modify" data-toggle="modal">
<span class="fa fa-pencil-square-o white"></span>
</a>
<form action="deletegeneral" method="POST">
<input type="hidden" value="${nombreArchivoReglas}" name="nombreArchivo" />
<input type="hidden" value="${generals.nomRegla}" name="dnomRegla">
<button type="submit" class="btn btn-default delete" onclick="showAlert('¿Está seguro que desea eliminar la regla \n " ${generals.nomRegla} "?',3);">
<span class="fa fa-trash-o white"></span></button>
</form>
<!--button type="button" class="btn btn-default modify" data-toggle="modal"
data-target="#Modificar2"><span class="fa fa-pencil-square-o white"></span></button-->
</td>
</tr>
<!--Para Modal de Modificacion-->
<div class="modal fade" id="Modificar_${generals.token}_${generals.tipoRegla}_${generals.nomCampo}_${generals.nomRegla}_${generals.posIni}_${generals.posFin}_${generals.criterio}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">×</span> <span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">Modificar Regla</h4>
</div>
<!-- Modal Body -->
<div class="modal-body">
<form action="actualizargenerals" method="POST">
<input type="hidden" value="${nombreArchivoReglas}" name="nombreArchivo" >
<label for="exampleInputPassword1">Tipo Regla</label>
<input type='text' name='tipoRegla' class='form-control' id='nomCampo' readonly="readonly" placeholder=Tipo de Regla" value="${generals.tipoRegla}" required>
<label for="exampleInputPassword1">Campo</label>
<input type='text' name='nombreCampo' class='form-control' id='nomCampo' placeholder="Nombre del Campo" value="${generals.nomCampo}" required>
<label for="exampleInputPassword1">Regla</label>
<input type='text' name='nombreRegla' readonly="readonly" class='form-control' id='nombreRegla' placeholder="Nombre de la Regla" value="${generals.nomRegla}" required />
<label for="exampleInputPassword1">Inicio</label>
<input type='number' name='posIni' class='form-control' id='posInicial' placeholder="Posición Inicial" value="${generals.posIni}" required min="0" max="254" />
<label for="exampleInputPassword1">Fin</label>
<input type='number' name='posFin' class='form-control' id='posFinal' placeholder="Posición Final" value="${generals.posFin}" min="0" max="254" required>
<c:choose>
<c:when test="${generals.tipoRegla eq 'TOKEN' }">
<label for="token">Token</label>
<input type='text' name='token' class='form-control' id='token' value="${generals.token}" placeholder="Token">
</c:when>
</c:choose>
<label for="exampleInputPassword1">Argumentos</label>
<div class="row">
<select class="form-control" name="tipocriterio" onchange="changeFunc4(this);" >
<option selected value="vacio" >----------</option>
<option value="actual" >ACTUAL</option>
<option value="nuevo" >NUEVO</option>
</select>
<div id="divactual" name="divactual">
div actul no mostrara mas que el valor actual
</div>
<div id="divnuevo" name="divnuevo">
div nuevo tendra mas elementos
</div>
</div>
<!-- Modal Footer -->
<div class="modal-footer">
<div class="row">
<div class="col-md-6 col-xs-6 col-sm-6 col-lg-6">
<button href="#" class="btn btnAceptar">Modificar Regla</button>
</div>
<div class="col-md-6 col-xs-6 col-sm-6 col-lg-6">
<button type="button" class="btn btnCancelar" data-dismiss="modal">Cancelar</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!--Finaliza Modal de modifacion-->
</c:forEach>
</c:otherwise>
</c:choose>
</tbody>
</table>
想法？
答案 0 :(得分：0)
以下是将代码放在结束表标记下面的示例。
</table>
<c:if test="${generals.size()!=0}">
<c:forEach items="${generals}" var="generals">
<!--Para Modal de Modificacion-->
<div class="modal fade" id="Modificar_${generals.token}_${generals.tipoRegla}_${generals.nomCampo}_${generals.nomRegla}_${generals.posIni}_${generals.posFin}_${generals.criterio}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">×</span> <span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">Modificar Regla</h4>
</div>
<!-- Modal Body -->
<div class="modal-body">
<form action="actualizargenerals" method="POST">
<input type="hidden" value="${nombreArchivoReglas}" name="nombreArchivo" >
<label for="exampleInputPassword1">Tipo Regla</label>
<input type='text' name='tipoRegla' class='form-control' id='nomCampo' readonly="readonly" placeholder=Tipo de Regla" value="${generals.tipoRegla}" required>
<label for="exampleInputPassword1">Campo</label>
<input type='text' name='nombreCampo' class='form-control' id='nomCampo' placeholder="Nombre del Campo" value="${generals.nomCampo}" required>
<label for="exampleInputPassword1">Regla</label>
<input type='text' name='nombreRegla' readonly="readonly" class='form-control' id='nombreRegla' placeholder="Nombre de la Regla" value="${generals.nomRegla}" required />
<label for="exampleInputPassword1">Inicio</label>
<input type='number' name='posIni' class='form-control' id='posInicial' placeholder="Posición Inicial" value="${generals.posIni}" required min="0" max="254" />
<label for="exampleInputPassword1">Fin</label>
<input type='number' name='posFin' class='form-control' id='posFinal' placeholder="Posición Final" value="${generals.posFin}" min="0" max="254" required>
<c:choose>
<c:when test="${generals.tipoRegla eq 'TOKEN' }">
<label for="token">Token</label>
<input type='text' name='token' class='form-control' id='token' value="${generals.token}" placeholder="Token">
</c:when>
</c:choose>
<label for="exampleInputPassword1">Argumentos</label>
<div class="row">
<select class="form-control" name="tipocriterio" onchange="changeFunc4(this);" >
<option selected value="vacio" >----------</option>
<option value="actual" >ACTUAL</option>
<option value="nuevo" >NUEVO</option>
</select>
<div id="divactual" name="divactual">
div actul no mostrara mas que el valor actual
</div>
<div id="divnuevo" name="divnuevo">
div nuevo tendra mas elementos
</div>
</div>
<!-- Modal Footer -->
<div class="modal-footer">
<div class="row">
<div class="col-md-6 col-xs-6 col-sm-6 col-lg-6">
<button href="#" class="btn btnAceptar">Modificar Regla</button>
</div>
<div class="col-md-6 col-xs-6 col-sm-6 col-lg-6">
<button type="button" class="btn btnCancelar" data-dismiss="modal">Cancelar</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!--Finaliza Modal de modifacion-->
</c:forEach>
</c:if>
所以只需移动模态代码并保持原样。
编辑：
以下是用jQuery编写的changeFunc4函数的示例，仅针对当前选择框旁边的元素：
function changeFunc4(sel2){
var sel = $(sel2);
if (sel.val() == "actual") {
sel.siblings( ".divactual" ).show();
sel.siblings( ".divnuevo" ).hide();
}
if(sel.val() == "nuevo"){
sel.siblings( ".divnuevo" ).show();
sel.siblings( ".divactual" ).hide();
}
if(sel.val() == "vacio"){
sel.siblings( ".divnuevo" ).hide();
sel.siblings( ".divactual" ).hide();
}
}
注意，这使用css类引用，因此您需要更新div以包含类。 e.g。
<div id="divactual" class="divactual" name="divactual">
div actul no mostrara mas que el valor actual
</div>