Easy Question

holyearth · 10-13-2006, 06:59 AM

Hello Experts, I have a question for you. Keep in mind that I am a noob. Please dont bash me. Thank you in advance for your help.

I am looking for a javascript code that will take data inserted into a text box (form?) and put it into a drop down box.

For example, a user comes to my website and in a text box enters:

1
2
3
4
5

and the user clicks "OK"

I want the javascript to take the 1 2 3 4 5 and put it into a drop down box. The drop down box is right besides the text box. Then once the data is properly in the drop down box the user can "SUBMIT" (VIA POST) this information to me.

Thanks for your help, I will not mind paying for this if necessary.

_Aerospace_Eng_ · 10-13-2006, 07:29 AM

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
function setSelect(what)
{
	document.forms[0].drop.options.length = 0;
	var num = /\d/;
	var theOption1 = document.forms[0].drop.options[0]=new Option('How many?','null', true, false);
	var j = 1;
	if(num.test(what))
	{
		for(i = 0; i <= parseInt(what); i++)
		{
			var theOptions = document.forms[0].drop.options[j++]=new Option(i,i, false, false);
		}
	}
}
</script>
</head>

<body>
<form action="#" method="post">
<input type="text" name="howmany" onKeyUp="setSelect(this.value)">
<select name="drop">
<option value="null">How many?</option>
</select>
</form>
</body>
</html>

Kor · 10-13-2006, 09:56 AM

But... what is the use?

holyearth · 10-13-2006, 02:28 PM

Aerospace thank you so much for that. It's almost what I needed.

In your code the drop down is fed by an input box that can only accept one number. I actually need like a textarea where a user can enter multiple numbers (line by line) like:

2
4
7
10

and then they get "moved" into the drop down box as follows:

<option value="2">2</option>
<option value="4">4</option>
<option value="7">7</option>
<option value="10">10</option>

Kor,

I need this because I have a form that must be submitted using the select element. To feed the data for submission I need the user to type in some numbers.

Kor · 10-13-2006, 02:31 PM

Still I don't see the point... From the CGI/server side point of view, it does not matter which kind of the controls (input, select...) sends data. As long as you have already a control (input, textarea...) why to double the data sent?.... Server side application will receive both your text control data and your select control data as well.

holyearth · 10-13-2006, 02:37 PM

Yes, but I don't have control of the server side.

Server side is set to accept data from <select> element only. That is why I must feed data into <select> by hook or by crook.

holyearth · 10-13-2006, 02:37 PM

I need this code and will pay for it. Please PM me if needed.

holyearth · 10-13-2006, 02:38 PM

This function "moves" but I don't know how to change it to make it work for me.

Code:

	
       function move(fbox,tbox) {
		var arrFbox = new Array();
		var arrTbox = new Array();
		var arrLookup = new Array();
		var i;
		
		for(i = 0; i < tbox.options.length; i++){
			arrLookup[tbox.options[i].value] = tbox.options[i].text;
			arrTbox[i] = tbox.options[i].value;
		}
		
		var fLength = 0;
		var tLength = arrTbox.length;
		
		for(i = 0; i < fbox.options.length; i++) {
			arrLookup[fbox.options[i].value] = fbox.options[i].text;
		
			if(fbox.options[i].selected && fbox.options[i].value != ""){
				arrTbox[tLength] = fbox.options[i].value;
				tLength++;
			}else{
				arrFbox[fLength] = fbox.options[i].value;
				fLength++;
			}
		}
		
		fbox.length = 0;
		tbox.length = 0;
		var c;
		
		for(c = 0; c < arrFbox.length; c++) {
			var no = new Option();
			no.text = arrLookup[arrFbox[c]];
			no.value = arrFbox[c];
			fbox[c] = no;
		}
		
		for(c = 0; c < arrTbox.length; c++) {
			var no = new Option();
			no.text = arrLookup[arrTbox[c]];
			no.value = arrTbox[c];
			tbox[c] = no;
		}
	}

_Aerospace_Eng_ · 10-13-2006, 03:21 PM

Okay now I think you should explain what it is that you are really trying to do as it seems to you are trying to get around something since you have no control of the server side stuff.

holyearth · 10-13-2006, 03:28 PM

Im trying to submit values to a server. Users will come to my site and type in some numbers in a textarea like....

52151
91818
13518
46618
39184

I need those numbers converted into an option value in a select drop down box.

The server is not owned or operated by me. The server is configured to only process drop down value numbers. This is for a weather application. Users are entering zip codes to see weather in their surrounding area. No harm being done here.

_Aerospace_Eng_ · 10-13-2006, 03:36 PM

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
function setSelect()
{	
	document.forms[0].drop.options.length = 0;
	var thenums;
	if(!window.attachEvent)
	{
		thenums = document.forms[0].howmany.value.split('\n');
	}
	else
	{
		thenums = document.forms[0].howmany.value.split('\r\n');
	}
	var num = /^([0-9]+)$/;
	for(var i = 0; i < thenums.length; i++)
	{
		if(num.test(thenums[i]))
		{
			var theOptions = document.forms[0].drop.options[i]=new Option(thenums[i],thenums[i], false, false);
		}
	}
}
</script>
</head>
<body>
<form action="#" method="post">
	<textarea name="howmany" cols="20" rows="10" onblur="setSelect()"></textarea>
	<select name="drop">
	</select>
</form>
</body>
</html>

holyearth · 10-13-2006, 03:42 PM

Aerospace,

Thanks that was it.

Aerospace, can you PM me with an email address perhaps? I would really like to paypal you some funds for helping me out. I appreciate your time. If you want, please email me at holyearth [at] gmail.com

Regards

Kor · 10-13-2006, 04:46 PM

Ok, here's your code:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="txt/javascript">
<script type="text/javascript">
function build(f){
var t=f['tx'], s=f['sel'], i=0, v
var val=t.value.split(document.all?'\r\n':'\n');
while(v=val[i++]){
var o=document.createElement('option')
o.setAttribute('value',v);
o.appendChild(document.createTextNode(v))
s.appendChild(o)
}
}
</script>
</head>
<body>
<form>
<textarea name="tx"></textarea>
<select name="sel">
</select>
<br>
<br>
<input type="button" value="Complete" onclick="build(this.form)">
</form>
</body>
</html>

Kravvitz · 10-13-2006, 11:35 PM

Why are you both using object detection for the split() delimiter? Kor, you shouldn't ever use document.all to detect IE.

IE4+ and NS4+ support using RegExp in addition to strings. (That was standardized in ECMA-Script 3.)

Code:

split(/[\r\n]+/)

Kor · 10-14-2006, 06:14 AM

Quote:

Originally Posted by Kravvitz

Why are you both using object detection for the split() delimiter? Kor, you shouldn't ever use document.all to detect IE.

IE4+ and NS4+ support using RegExp in addition to strings. (That was standardized in ECMA-Script 3.)

Code:

split(/[\r\n]+/)

..because, for unknown reasons, IE and Moz react different to the split upon \r\n