如何在 JSP javascript 注入的子级中使用父级 JSP 变量？

Question

大家好，我正在使用 JSP 在 Spring MVC 应用程序中工作，我的问题是在某个时刻我发出一个控制器请求以获取一段 JSP 代码以包含在一个 div 中。我从 ModelAndView 答案中获得 JSP 代码。我用 JQuery 把它放在我的 div 上。但是当我想使用我的 JSP 容器变量时，我做不到。我会展示我的代码。

JSP 容器（父级）

                <div class="row" id="principalDiv">
                <div id="menuZone">
                    <c:forEach items="${user.rol.permisos}" var="permisos">


                        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-2 iconos methodDiv" id="${permisos.permisoMetodoMap}">
                            <div>

                                <center>
                                    <i class="fa <c:out value="${permisos.permisoMetodoIcono}" /> fa-5x" id="icon_${permisos.permisoMetodoMap}"></i>
                                </center>
                                <br>
                                <center>
                                    <div>
                                        <c:out value="${permisos.permisoNombre}" />
                                    </div>
                                </center>

                            </div>

                        </div>
                    </c:forEach>
                </div>

                <div id="loadZone">
            </div>

        </div>

我通过一个按钮向我的控制器发出请求，以获取“loadZone”的内容。

代码 JSP 请求

function loadAsp(element) {
    $.get('getInclude', {
        include : $(element).attr('id')
    }, function(responseText) {
        $('#loadZone').html(responseText);
    });
}

控制器

@Controller
@RequestMapping(value = "/getInclude")
public class IncludesDispatcherController {

    @Autowired
    FormModelBo boConsultas;
    @GetMapping
public ModelAndView getReportesView() {
        ModelAndView mav = new ModelAndView("includes/reportes");
        try {
            mav.addObject("consultas", boConsultas.consultaGeneral());
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }

        return mav;

    }

}

我返回带有模型的视图以制作标题表，可以在上面的 JQuery 片段中看到我使用 html() 方法将视图放入 div 中。

要包含的 JSP（子级）

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page isELIgnored="false"%>

        <div>
            <center>
                <legend>
<!--                //<img alt="" src="img/pen.png"> -->
                    Censo M&eacute;tricas Triage ${user.nombre}<br />  <--- this is parent variable.
                </legend>
            </center>
        </div>
        <form action="${user.rol.rolMap}/createExcel" method="POST" role="form" id="">

            <div class="form-group">

                <!-- -------------------------------------------first section--------------------------- -->
                <div class="row" style="padding-bottom: 22px !important;">
                    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">

                        <div class="form-group">
                            <div class="form-group ">
                                <div class="input-group ">
                                    <span class="input-group-addon">Fecha inicio</span> <input type="date" id="fecha_1" name="fecha_1" />
                                </div>
                                <div class="help-block with-errors"></div>
                            </div>

                        </div>
                    </div>

                    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
                        <div class="form-group">
                            <div class="form-group ">
                                <div class="input-group ">
                                    <span class="input-group-addon">Fecha final</span> <input type="date" id="fecha_2" name="fecha_2" />
                                </div>
                                <div class="help-block with-errors"></div>
                            </div>

                        </div>
                    </div>

                    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
                        <div class="form-group">
                            <div class="input-group">
                                <button type="submit" class="btn btn-primary">Generar Reporte</button>
                            </div>
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                </div>
            </div>

        </form>


        <div style="padding-bottom: 22px !important;">
            <table class="table">
                <thead>
                    <tr>
                        <th>Nombre de médico</th>
                        <th>Número de consultas</th>

                    </tr>
                </thead>
                <tbody>
                    <c:forEach items="${consultas}" var="consultasLista">
                        <tr>
                            <td><c:out value="${consultasLista[0]} ${consultasLista[1]} ${consultasLista[2]}" /></td>
                            <td><c:out value="${consultasLista[3]}" /></td>
                        </tr>
                    </c:forEach>
                </tbody>
            </table>

        </div>

我在 ModelAndView 中发送的模型变量正在工作，但我的父母没有。

我尝试使用其他方法，例如声明变量

<%
String variable = "test";
%>

或

request.setAttribute("attrName", myValue); (for catch it in my children JSP with request.getAttribute())

但也不起作用。我不知道是不是因为 JSP 父代码已经编译了。我需要访问我的父变量。

请帮助我并感谢您的时间。

Answer 1

如果您需要在 IncludesDispatcherController 中使用变量 ${user.nombre}，则需要将其注入此控制器，然后注入视图，否则将为空。

无论如何，就像有人已经提到 JSP 是服务器端语言一样，您与 javascript 和 Ajax 的交互并不是很完美。如果您不直接发送 HTML，但例如只使用 JSON 发送 javascript 需要的数据，这是更好的方法。

之后，如果您使用父母中已有的数据会更好 - "${user.rol.permisos}"。您可以将它放在“data-”标签中，然后通过 JQuery 轻松读取。在您的循环中，您可以执行以下操作：

<a href="#" id="icon_1" data-nombre="${permisos.permisoNombre}">

并通过以下方式阅读：

$("a#icon_1" ).data("nombre");