Solved

Adding items to text area

Posted on 2009-07-05
3
397 Views
Last Modified: 2012-05-07
Hello all. I have a form which contains an empty textarea, a textbox with add and delete button. If a user types in textbox and click add i want the value to be appended in the textarea. If the user tries to add again in the textbox i want it to be appended to a new line of the textarea. Same thing goes for the delete. The user have to select that number from the textarea and click on delete, that number should be deleted from the textarea.
Can anyone provide me some info or some links ?
0
Comment
Question by:Micheal_Male
  • 2
3 Comments
 
LVL 9

Assisted Solution

by:Graceful_Penguin
Graceful_Penguin earned 100 total points
Comment Utility
Does have the row attribute/property  but it can only be used to limit the amount of rows in the textarea not to manipulate the content like a list view. But the attached code might help you in the right direction.
<html>

<head>

<title>Interactive Textarea</title>

</head>

<body>

<table style="text-align: left; width: 100px;" border="0" cellpadding="0" cellspacing="2">

<tbody>

<tr><td><input size="20" id="inputtext">

<input type="button" name="add" value="Add" onclick="addStuff()">

</td></tr>

<tr><td><textarea rows="15" id="textarea" name="box" cols="22"></textarea>

<input type = "button" name = "Delete" value = "Delete" onclick="deleteStuff()">;

</td></tr></tbody>

</table>

<br>
 

<script type = "text/javascript">
 

var oldText = new Array();

oldText[0] = "";

var i = 0; // global variable
 

function addStuff(){

var obj=document.getElementById('textarea');

obj.scrollTop=obj.scrollHeight;
 

if(document.getElementById('inputtext').value != "") {

oldText[i] = textarea.value;

document.getElementById('textarea').value+='" '+inputtext.value+'\n\n';

i++;

} 

}
 

function deleteStuff() {

if (i >= 1) {

document.getElementById('textarea').value = oldText[i-1];

i--;

var obj=document.getElementById('textarea');

obj.scrollTop=obj.scrollHeight;
 

}

}
 

</script>
 

</body>

</html>

Open in new window

0
 

Author Comment

by:Micheal_Male
Comment Utility
Than for the reply actually it is a list box instead of a textatea I will try myself first and will post if I have any questions
0
 

Accepted Solution

by:
Micheal_Male earned 0 total points
Comment Utility
I got the list box to worked as expected. Thanks for all your help :--).
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Suggested Solutions

Avoid defining the variables in the global scope; trying to define them in a local function scope. Because:   • Look-up is performed every time a variable is accessed.   • Variables are resolved backwards from most specific to least specific scope…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now