Win a copy of Programmer's Guide to Java SE 8 Oracle Certified Associate (OCA) this week in the OCAJP forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Auto generate textbox from a dropdown

 
Kingsley Efekodo
Greenhorn
Posts: 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Am new to JSP.
Need help in auto generating textbox from selecting a number from a dropdown and getting the values from the auto generated texbox.

e.g if i select the number 4, it should auto generate four textbox for me. And need to get the values of the generated textbox when data is entered.
Thanks in advance
 
J. Kevin Robbins
Bartender
Pie
Posts: 1801
28
Chrome Firefox Browser jQuery Linux MySQL Database Netbeans IDE
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
There are at least two approaches you can take. I'll let you pick one, take your best shot, and post your code here. First of all, let's get the terminology straight. There is no dropdown in html, it's a select-option control.

Now you can wrap that select-option in a form with a submit button and send the value to a servlet that will generate the page you want. Or you can use Javascript (jQuery would be my choice) and act on the "onChange" event of the select-option control to create the text boxes. Most likely, the text boxes will be wrapped in a form with a submit button and will post to a servlet.

If you are not comfortable with Javascript, I would recommend that you start with the first approach. Give it your best shot and come back here with the results and we'll help some more.
 
Kingsley Efekodo
Greenhorn
Posts: 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Kindly find code below. My Challenge is how to get the values from the textfield and use for my database. need help.
thanks.

code:
<%--
Document : autoform
Created on : Dec 9, 2013, 2:38:44 PM
Author : Efekodo Kingsley
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" ></script>
<script type="text/javascript">
//when the webpage has loaded do this
$(document).ready(function() {
//if the value within the dropdown box has changed then run this code
$('#num_cat').change(function() {
//get the number of fields required from the dropdown box
var num = $('#num_cat').val();

var i = 0; //integer variable for 'for' loop
var html = ''; //string variable for html code for fields
//loop through to add the number of fields specified
for (i = 1; i <= num; i++) {
//concatinate number of fields to a variable
html += 'Category ' + i + ': <input type="text" name="category-' + i + '"/><br/>';
}

//insert this html code into the div with id catList
$('#catList').html(html);
});
});
</script>
</head>
<body>
<form method="post" action="action.php">
Number of fields required:
<select id="num_cat" name="num_cat">
<option value="0">- SELECT -</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>

<div id="catList"></div>
<input type="submit" name="submit" value="Submit"/>
</form>
</body>
</html>
 
J. Kevin Robbins
Bartender
Pie
Posts: 1801
28
Chrome Firefox Browser jQuery Linux MySQL Database Netbeans IDE
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Need some more info. First, please use code tags and proper indenting to make your code more readable. Second, please post the resulting HTML generated by this code (after you've selected an option from the select control). Finally, and most important, what happens when you try this? Describe any error you get and the point at which it occurs.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic