0
我遇到了问题,我使用foreach恢复了文件中的数据,并在每行中显示了一个编辑按钮,在窗口中调用了一个模态窗口选择一种标准并显示相应的输入,问题是在第一行只有,而不是在其他行。代码为什么JavaScript只能在第一条记录上运行,而不能在其他条目上运行
部分:
\t if (sel2.value == "actual") {
\t \t document.getElementById("divactual").style.display = "block";
\t \t divT=document.getElementById("divnuevo");
\t \t divT.style.display = "none";
\t }
\t if(sel2.value == "nuevo"){
\t \t document.getElementById("divnuevo").style.display = "block";
\t \t divT=document.getElementById("divactual");
\t \t divT.style.display = "none";
\t }
\t if(sel2.value == "vacio"){
\t \t document.getElementById("divnuevo").style.display = "none";
\t \t divT=document.getElementById("divactual");
\t \t divT.style.display = "none"; \t \t
\t }
}
#divnuevo, #divactual{
\t display: block;
}
<table class="table table-list-search table-striped table-bordered text-table">
<thead>
\t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Tipo de Regla</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Nombre Campo</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Nombre Regla</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Pos Ini</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Pos Fin</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Token</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Criterio</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Argumentos</th>
\t \t \t \t \t \t \t \t \t \t \t <th class="text-center">Descripción</th>
\t \t \t \t \t \t \t \t \t \t \t <th></th>
\t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t </thead>
\t \t \t \t \t \t \t \t \t <tbody>
\t \t \t \t \t \t \t \t \t \t <c:choose>
\t \t \t \t \t \t \t \t \t \t \t <c:when test="${generals.size()==0}">
\t \t \t \t \t \t \t \t \t \t \t <td colspan="11"><h3 class="text-danger">No existen Registros de Reglas Generales en el Archivo</h3> </td>
\t \t \t \t \t \t \t \t \t \t <br/>
\t \t \t \t \t \t \t \t \t \t \t </c:when>
\t \t \t \t \t \t \t \t \t \t \t <c:otherwise>
\t \t \t \t \t \t \t \t \t \t \t \t <c:forEach items="${generals}" var="generals">
\t \t \t \t \t \t \t \t \t \t \t \t <tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td>${generals.tipoRegla}</td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td>${generals.nomCampo}</td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td>${generals.nomRegla}</td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td>${generals.posIni}</td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td>${generals.posFin}</td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td>${generals.token}</td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td class="wrap"><p class="test"> ${generals.criterio} </p> </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td class="wrap"><p class="test2">${generals.argumentos} </p> </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td class="wrap"><p class="test"> ${generals.descrip} </p> </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <c:set var="salary" scope="session" value="${generals.nomRegla}"/>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <td> \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <a role="button"
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t data-target="#Modificar_${generals.token }_${generals.tipoRegla}_${generals.nomCampo}_${generals.nomRegla}_${generals.posIni}_${generals.posFin}_${generals.criterio}"
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t class="btn btn-default modify" data-toggle="modal">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <span class="fa fa-pencil-square-o white"></span>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </a>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <form action="deletegeneral" method="POST">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input type="hidden" value="${nombreArchivoReglas}" name="nombreArchivo" />
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input type="hidden" value="${generals.nomRegla}" name="dnomRegla">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <button type="submit" class="btn btn-default delete" onclick="showAlert('¿Está seguro que desea eliminar la regla \n " ${generals.nomRegla} "?',3);">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <span class="fa fa-trash-o white"></span></button>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </form>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <!--button type="button" class="btn btn-default modify" data-toggle="modal"
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t data-target="#Modificar2"><span class="fa fa-pencil-square-o white"></span></button-->
\t \t \t \t \t \t \t \t \t \t \t \t \t \t </td>
\t \t \t \t \t \t \t \t \t \t \t \t \t </tr>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <!--Para Modal de Modificacion-->
\t \t \t \t \t \t \t \t \t \t \t \t \t <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">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-dialog">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-content">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-header">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <button type="button" class="close" data-dismiss="modal">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <span aria-hidden="true">×</span> <span class="sr-only">Close</span>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </button>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <h4 class="modal-title" id="myModalLabel">Modificar Regla</h4>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <!-- Modal Body -->
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-body">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <form action="actualizargenerals" method="POST">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input type="hidden" value="${nombreArchivoReglas}" name="nombreArchivo" >
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <label for="exampleInputPassword1">Tipo Regla</label>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input \t type='text' name='tipoRegla' class='form-control' id='nomCampo' readonly="readonly" placeholder=Tipo de Regla" value="${generals.tipoRegla}" required> \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <label for="exampleInputPassword1">Campo</label>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input \t type='text' name='nombreCampo' class='form-control' id='nomCampo' placeholder="Nombre del Campo" value="${generals.nomCampo}" required>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <label \t for="exampleInputPassword1">Regla</label>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input type='text' name='nombreRegla' readonly="readonly" class='form-control' id='nombreRegla' placeholder="Nombre de la Regla" value="${generals.nomRegla}" required />
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <label for="exampleInputPassword1">Inicio</label>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input type='number' name='posIni' class='form-control' id='posInicial' placeholder="Posición Inicial" value="${generals.posIni}" required min="0" max="254" />
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <label \t for="exampleInputPassword1">Fin</label>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input type='number' name='posFin' class='form-control' id='posFinal' placeholder="Posición Final" value="${generals.posFin}" min="0" max="254" required>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <c:choose>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <c:when test="${generals.tipoRegla eq 'TOKEN' }">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <label for="token">Token</label>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <input type='text' name='token' class='form-control' id='token' value="${generals.token}" placeholder="Token">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </c:when>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </c:choose>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <label for="exampleInputPassword1">Argumentos</label>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="row">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <select class="form-control" name="tipocriterio" onchange="changeFunc4(this);" >
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <option selected value="vacio" >----------</option>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <option value="actual" >ACTUAL</option> \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <option value="nuevo" >NUEVO</option> \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </select>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div id="divactual" name="divactual">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t div actul no mostrara mas que el valor actual
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div id="divnuevo" name="divnuevo">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t div nuevo tendra mas elementos
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <!-- Modal Footer -->
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-footer">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="row">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="col-md-6 col-xs-6 col-sm-6 col-lg-6">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <button href="#" class="btn btnAceptar">Modificar Regla</button>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <div class="col-md-6 col-xs-6 col-sm-6 col-lg-6">
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <button type="button" class="btn btnCancelar" data-dismiss="modal">Cancelar</button>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </form>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <!--Finaliza Modal de modifacion--> \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t \t \t \t \t \t </c:forEach>
\t \t \t \t \t \t \t \t \t \t \t </c:otherwise>
\t \t \t \t \t \t \t \t \t \t </c:choose>
\t \t \t \t \t \t \t \t \t </tbody>
\t \t \t \t \t \t \t \t </table>
想法?
您有表格行
好吧,我把完整的代码。 –
这仍然显示你将你的模态放在你的桌子中间。您的代码基本上会结束
回答
下面是将代码放置在闭合表标记下的示例。
所以,只要移动模态代码,并保持原样。
编辑:
这是写在jQuery的目标不仅仅是元素的changeFunc4函数的例子旁边的当前选择框:
注意,这里采用的CSS类的引用,所以你需要更新您的div以包含课程。例如
来源
2016-07-22 00:32:19
对,谢谢,但只适用于第一行,而不是其他人。 隐藏和显示元素div。
这可能是因为您对divactual和divnevo的多个实例使用相同的id。你需要让ID独一无二。或者你可以交换使用一个类来显示最接近当前选择框的那个。 –
嗨,这将是有效的生成随机名称和用来命名divs? –
相关问题