JAVASCRIPT question...

Toggle sidebar Toggle sidebar
G

Go Terps

Senior member
Mar 11, 2000
232
0
0
I want to have a textbox and a listbox...
I want the user to be able to add text into the textbox and click an add button to add that text to a listbox...
I also want the user to be able to remove and value from the listbox...

I have searched everything but can't find any help on this...

any suggestions to links are greatly appreciated...
 
K

kt

Diamond Member
Apr 1, 2000
6,031
1,346
136
Hmm.. I've written a little Javascript code that does similar to what you're describing. Let me see if I can dig it up, it's been a while.
 
T

teknodude

Member
Apr 11, 2002
186
0
0
After a little scrounging around on The JavaScript Source (javascript.internet.com) I've figured out this script...

<html>
<head>
<title>Add Items to Listbox</title>
<script language="JavaScript">
<!--

function addListItem(target, source){

if(source.value != ""){
// Create new option for listbox
newItem = document.createElement("option");

// Get value and text for new option from textarea
newItem.value = document.listBoxForm.textToAdd.value;
newItem.text = document.listBoxForm.textToAdd.value;

// Add the new item to the listbox
target.add(newItem);
}
}

//-->
</script>
</head>
<body bgcolor="#FFFFFF">

<form name="listBoxForm" method="post" action="formhandler.php">
<textarea name="textToAdd" cols="50" rows="10"></textarea>

<input type="button" value="Add item" onclick="addListItem(document.listBoxForm.listBox, document.listBoxForm.textToAdd)"><p>
<select name="listBox">
<option>Add items using the textbox
</select>
</form>

</body>
</html>

You can see the demo at http://www.gplenderleith.freeserve.co.uk/demos/additems.htm

Hope that helps :D

teknodude

[edit]
You'll want to check out this URL: http://javascript.internet.com/forms/ and from there figure out how to remove listbox items etc.
Oh, and btw, the code I've figured out only seems to work in IE :-S Man, I'm not much help...
[/edit]
 
K

kt

Diamond Member
Apr 1, 2000
6,031
1,346
136
Yeah, that will only work with IE. Here's my cross browser version of the code:

<script language="JavaScript">
<!--
function addListItem(target, source){
var k=0;

if(source.value != ""){
while(target.options[k] != null){
i++;
}

target.options[k] = new Option(document.listBoxForm.textToAdd.value);
target.options[k].value = document.listBoxForm.textToAdd.value;
}
}

function removeListItem(target){
var tempList = new Array();
var k=0;
var j=0;

while(target.options[k] != null){
if(target.options[k].selected == false){
tempList[j] = target.options[k].value;
j++;
}
i++;
}

for(k=target.length; k>=0; k--){
target.options[k] = null;
}

for(k=0; i<=j; k++){
target.options[k] = new Option(tempList[k]);
target.options[k].value = tempList[k];
}
}
//-->
</script>

All you need is to add the Remove button along with that form teknodude created and have it call the remove function using the onclick event.

--edit--
DOH! stupid forum doesn't allow me to do the array bracket thingy with the "i" inside.. that's the code for italic.. changed all of them to "k" instead.
 
You must log in or register to reply here.

TRENDING THREADS

COMPANY
RESOURCES
FOLLOW
Top Bottom