Home/ Questions/Q 8891965
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T22:52:48+00:00

I’m really new in javascripting…(my webpage is based on jsp) I’m trying to generate

  • 0

I’m really new in javascripting…(my webpage is based on jsp)
I’m trying to generate input box when option from select box is selected…
When user select any input from select box, it will send value to function init() and generate input boxes based on the value…

For example: if

<option value="IP,OS" name="sysl"><%=sysname%></option>

is selected..then it should generate something like

<tr>
<td> Enter IP:</td>
<td><input type="text" id="IP" name="IP"></td>
</tr>
<tr>
<td> Enter OS:</td>
<td><input type="text" id="OS" name="OS"></td>
</tr>

But my code does doesn’t generate any…

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <title>Run Batch Script</title>
    <script type="text/javascript">

    function init() {
        document.getElementById("bname").addEventListener("change", function(){
        var value = document.getElementById("bname").value; // this gives you the selected value.
        var split = value.split;
        var splitsize = split.length;
        for (var j=0; j<splitsize; j++){
            var a = "<input type = 'text' name = '" + split[j] + "' id = '" + split[j] + "'>";
            document.getElementById("inputBox").innerHTML = a;
        }
        // Your code to add the element that you need.

        }
    )};


    </script>
<body>
    <form action="./run?host=<%=host%>&envname=<%=envname%>" method="post" name="batchForm">  
    <table border="0">
    <tr style="font-weight: bold; font-size: 16px;">
        <td>System Name: </td>
    </tr> 


     <tr>
        <td>Select Batch : </td>
        <td><select id="bname" name="bname" onclicke="init()">
       <%
       String src = "";
       String[] temp;
       String loc = root + "\\" + "Temp.txt";
       int c;
       int tempsize;
       String param;
       BufferedReader S = new BufferedReader(new FileReader(loc));
       ArrayList<String> list = new ArrayList<String>();
       while ((src = S.readLine()) != null){
            c = 3;
            param = "";
            temp =src.split(":");
            tempsize =temp.length;
            list.add(temp[0]);
            if ((tempsize >2)){
                int i;
                for (i=2; tempsize>i ; i++){

                    if((temp[i].equals("null"))){
                        param = "";
                    }
                    else if ((i ==2) && (temp[i] != "null")){
                        param = temp[i];
                    }
                    else if ((i > 2)){
                        param = param + "," + temp[i];
                    }
                }
            }
            %>
            <option value="<%=param%>" name="<%=temp[0]%>"><%=temp[0]%></option>
                <%
            }
       BatchS.close();
    %>
            </select></td>
     </tr>
     <div id = "inputBox"></div>

What did I do wrong?

Thanks in advance!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    There is some confusion about the event registration of your tag. As you said your are new to javascript, I think that it worth some explanation about event registration.

    You have two ways to register some event in your HTML tag.

    • Using some onSomething attribute, for example:

    <select onclick="myFunction()"/>

    • The other way, is to register the event handler using javascript:

    document.getElementById("sysinfo").addEventListener("click", function(){...});

    Both will work. However, in the first example the handler will be registered for you automatically when the page loads. The second way, the handler must be registered manually.

    In your code you are trying to mix both.

    You can either use the tag event registration, and the event is onchange (not onselect as pointed by David). OR you will have to call the init() function when the page loads. One way to do that is by putting the following code at the end of your HTML to register your event when page loads.

     <script type="text/javascript">
 init();
 </script>

    In summary I would do:

    <script type="text/javascript">
   function writeInputs() {
        alert('writing inputs'); //helps checking if the handler is ok .. comment this when done
        var value = document.getElementById("sysinfo").value; // this gives you the selected value.
        var split = value.split;
        var splitsize = split.length;
        var code = '';
        for (var j=0; j<splitsize; j++){
            var a = "<input type = 'text' name = '" + split[j] + "' id = '" + split[j] + "'>";
            code += a;
        }
        document.getElementById("inputBox").innerHTML = code;
   }
</script>

<select id="sysinfo" name="sysname" onchange="writeInputs()">

    The javascript is already corrected with a solution to the problem pointed by JB Nizet. I have not tested the code so there can be other problems

    • 0