I'm trying to print a list of options in a datalist on a .jsp file ... I've tried many ways (both in java and in js) but not one seems working.

The list is a list of String "my.package.class"

<% 
List<String> cacheResettabili= Arrays.asList(new String[] {
"my.package.class",
"my.package.class",
...
});
log4debug.debug("creato lista ", cacheResettabili);
%>
    <td align="center" >
                <input type="text" list="CacheResettabili" name="classe"  value="<%=classeVal %>" style="width: 100%;" onl oad="docReady()"/>
                <datalist id="CacheResettabili">
                    <c:forEach items="${cacheResettabili}" var="cacheResettabile">
                        <option value="${cacheResettabile}">${cacheResettabile}</option>
                    </c:forEach>
                </datalist>
            </td>

I don't know why but this won't work and won't give errors (maybe is the datalist?).

In any case I recreated the list in a javascript external file and recalled from the jsp as follows

<script type="text/javascript">
<%@ include file="components/ResetCacheHome.js" %>
</script>

Indeed it works, because in the console prints this error

Uncaught RangeError: Maximum call stack size exceeded
    at <anonymous>
    at new Promise (<anonymous>)
    at sleep ((index):615:12)
    at docReady ((index):623:7)
    at docReady ((index):624:7)
    ...

And if I recall the following function docReady() from the console of the browser it works and create the correct datalist...

var cacheList=[
"my.package.class",
"my.package.class",
...
];
function renameOptions(){
        cacheList.forEach(value=>{
            let father =document.getElementById("CacheResettabili");
            let son = document.createElement("option");
            son.id=value;
            son.value=value;
            son.innerHTML=value.substring(value.lastIndexOf(".") 1);
            father.appendChild(son);
        });
    }

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}
function docReady() {
        // see if DOM is already available
        if (document.readyState === "complete" || document.readyState === "interactive") {
            // call on next available tick
            renameOptions();
        } else {
            sleep(15000);
            docReady();
        }
    }

docReady(); 

It doesn't matter where the list is, in java or js, obviously it would be better to have it just in one place.

Thanks for any help.

NOTE: About the js error, I tried without the docReady function (and just the renameOptions) too, but it will say that father has not been found (because js runs before the page is completely loaded...)

THE QUESTION: How can I print a list of options in a datalist dinamically on a .jsp file? (See the code for more infos)

IMAGES: In the first image you see the suggestion from the browser (note the little triangle pointing down missing), in the second one the datalist correctly working.

CodePudding user response：

The following did work.

<%
    StringBuilder sb= new StringBuilder();
    cacheResettabili.forEach(cacheResettabile ->  {
        sb.append("<option value=\"" cacheResettabile "\">" cacheResettabile.substring(cacheResettabile.lastIndexOf('.') 1) "</option>");
        log4debug.debug("aggiunta ", cacheResettabile);
    });
    String listaCache= sb.toString();
%>

...

<td align="center" >
                <input type="text" list="CacheResettabili" name="classe"  value="<%=classeVal %>" style="width: 100%;" id="ClasseToJMS" onkeyup="inserisciValore()"/>
                <datalist id="CacheResettabili">
                    <%=listaCache%>
                </datalist>
            </td>