Can't get jstl variable in inclued jsp

Question

I'm trying yo create a step form. In this step form all this divs must have different ID to allow me to call the next one when user click on next button. Here's my main code :

            <c:set var="cpt" value="${1}" />
            <div class="row" style="border: 1px solid #f0f0f0;"
                id="stepDiv-${cpt}">
                <jsp:include page="Step1.jsp" />
            </div>
            <c:set var="cpt" value="${cpt + 1}" />
            <div class="row" style="border: 1px solid #f0f0f0; display: none;"
                id="stepDiv-${cpt}">
                <jsp:include page="Step2.jsp" />
            </div>

In this code cpt is a JTSL variable that help me to give diffrent ID to these divs and I'm triyng to use this variable to pass to the next div by passing it into a javascript function.

Here is the other jsp that I include :

Step1.jsp:

<button class="btn btn-round btn-info myBtn "
            id="buttonNext-${cpt}"
                    onclick='next(${cpt})'>next</button>

Step2.jsp:

<button id="buttonNext-${cpt}" onclick='next(${cpt})'>next</button>
        <button id="buttonPrevious-${cpt}" onclick='previous(${cpt})'>previous</button>

And here is my javascript code :

function previous(i) {

                document.getElementById("stepDiv-" + i).style.display = "none";
    i--;
                document.getElementById("stepDiv-" + i).style.display = "block";
                document.getElementById("step-" + i).className += " active";

            }

    function next(i) {

                document.getElementById("stepDiv-" + i).style.display = "none";

                i++;
                document.getElementById("stepDiv-" + i).style.display = "block";
                document.getElementById("step-" + i).className += " active";
            }

Problem : the problem is that the included JSP can't get the value of ${cpt} . So how can I get this value ?

Answer 1

You can fix it using this instead :

<c:set var="cpt" value="${1}" />
            <div class="row" style="border: 1px solid #f0f0f0;"
                id="stepDiv-${cpt}">
                <jsp:include page="Step1.jsp" <jsp:param
                        name="variable" value="${cpt}" /></jsp:include>
            </div>
            <c:set var="cpt" value="${cpt + 1}" />
            <div class="row" style="border: 1px solid #f0f0f0; display: none;"
                id="stepDiv-${cpt}">
                <jsp:include page="Step2.jsp" <jsp:param
                        name="variable" value="${cpt}" /></jsp:include>
            </div>

and inside your jsp use :

<c:out value="${param.variable}"/>