How can I convert a string into a number in HTML? I wanted to convert an input value into a number and pass it into the script code. Pressing the button should do this conversion and pass the variable.

Enter a number: <input type="text" id="number" value=10>
<input type="button" id="change-btn" value="Change" onclick="getInput(number.value)">

<script language="javascript" type="text/javascript">
    function getInput(x){
        var input = x;
        alert(input);
    }
</script>

<Table border=2>
    <% for(int i = 1; i <= **X**; i++) { %>
        <tr>
            <td>Number</td>
            <td><%= i %></td>
        </tr>
    <% } %>
</Table>

How can I convert a string into a number in HTML? I wanted to convert an input value into a number and pass it into the script code. Pressing the button should do this conversion and pass the variable.

Enter a number: <input type="text" id="number" value=10>
<input type="button" id="change-btn" value="Change" onclick="getInput(number.value)">

<script language="javascript" type="text/javascript">
    function getInput(x){
        var input = x;
        alert(input);
    }
</script>

<Table border=2>
    <% for(int i = 1; i <= **X**; i++) { %>
        <tr>
            <td>Number</td>
            <td><%= i %></td>
        </tr>
    <% } %>
</Table>

• javascript
• html
• jsp
• type-conversion

• Where X es from? Don't forget your loop is executed server side while input happens client-side... – Adriano Repetti Commented Apr 2, 2015 at 11:28
• Is there any way we can request for the value from the client side and then use it on server side? – sudheeshcm Commented Apr 2, 2015 at 11:35
• you need to make an ajax request to a servlet to send data to server. Else make a form submit to send the data to servlet and use requestDispatcher to redirect to same page with populated table. – mohamedrias Commented Apr 2, 2015 at 11:36
• Of course, for every confirmed change (click on button) just post an AJAX request. Server will render required table and client will replace old HTML with new one (received from server). If you just need to render table of your example you may even do everything client-side... – Adriano Repetti Commented Apr 2, 2015 at 11:37
• Great. Got that. I'll get back to you guys after trying it. Thanks for your time. – sudheeshcm Commented Apr 2, 2015 at 11:38

2 Answers 2

For converting the string to number:

<input type="button" id="change-btn" value="Change" onclick="getInput()">

If you've noticed, I've removed number.value from getInput(), as number.value will not return you the input element value.

In javascript:

function getInput(){
    var input = document.getElementById("number").value;
    // conversion from string to integer
    if(isNaN(input)) return 0; // value is not a number
    var value = parseInt(input);
}

pass it into the scriptlet code.

This is not possible. As the scriplet has been piled in the server and sent to the client. You can't assign value back to scriplet. Else You need to make an ajax request to a servlet to send data to server. Else make a form submit to send the data to servlet and use requestDispatcher to redirect to same page with populated table.

There is no link between variables set in JavaScript and those set in Java scriptlet code in a JSP (well there can be but not in the way you are trying). If you want to use scriptlet code to display your table rows based on the number entered, you will have to add a form and post it back to the page. You would also need to add a name value to your text field. Then you would use request.getParameter("name of the text field") to get the value they entered and replace **X** with that value. You probably also want to make the changes that @mohamedrias proposes.