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 <!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>
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.
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.
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 <!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
Ok, here's your 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.)
split(/[\r\n]+/)
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.)
split(/[\r\n]+/)
..because, for unknown reasons, IE and Moz react different to the split upon \r\n
Kravvitz 10-14-2006, 06:28 AM They do react differently. That's why it's fortunate that RegExp can be used. ;)
I've just had a thought. Don't the options need to have selected=true for them to be sent to the server?
_Aerospace_Eng_, Opera 7+ supports window.attachEvent.
_Aerospace_Eng_ 10-14-2006, 02:33 PM They do react differently. That's why it's fortunate that RegExp can be used. ;)
I've just had a thought. Don't the options need to have selected=true for them to be sent to the server?
_Aerospace_Eng_, Opera 7+ supports window.attachEvent.
Which is fine because Opera seems to split the value both ways using \r\n or \n, it doesn't seem to matter. But regex can be used so that eliminates the use of object detection.
Kravvitz 10-14-2006, 09:00 PM In this case, yes, it doesn't matter. It's a bad habit to get though.
|