As I said ur question needed more elaboration...I guess(pls confirm) what you want is:
1. Regardless of user click on any check box, default value in text area will always remain in it.
2. When user clicks on any check box, it's text value should appear in the text area.
3. You do not want to duplicate any data
If that's the case then the code you are using is had a tiny issue, Let me help you with that.
First and foremost You should not use document.write, instead, use documents id and change its value and move the code to in the head section of the page unless if there is a specific reason for you to have javascript code in body
If you look at the code you will see whenever function updateArea is called, it clears the content of the textarea by using this code
document.getElementById('area').value = '';
And then the loop runs through all checkboxes and adds there values to text area, for those which checked.
But this always removes the default value as well. So what you really want is at every iteration(when updateArea is called, you want to make sure before the checkboxes are looped through, default value is set in the text area. For this purpose, I declared a global variable tarea and set default value to it(this is where u can change whatever default value you want). Secondly I added a line in the body tags onload event so that when page is loaded first time you will see the default value in text area
Then in the updateArea I set this variables value to text area as its preliminary value before it goes and loops through the check boxes.
As I said earlier this is again on my understand that that's what you are trying to do..
<head>
<title>Your Web Page Title</title>
<script type="text/javascript">
<!--
//set default value of the text area at page load
var tarea = "Some default value\n";
function updateArea (e) {
document.getElementById('area').value = tarea;
for (var i=0; i<e.form.elements.length; i++){
if (e.form.elements[i].type == 'checkbox' && e.form.elements[i].checked) {
document.getElementById('area').value += e.form.elements[i].nextSibling.data+"\n";
document.getElementById('area').value += '';
}
}
}
// -->
</script>
</head>
<body onload="document.getElementById('area').value = tarea;">
<form action="" method="get">
<div>
<label><input type="checkbox" onclick="updateArea(this)">How many previous owners has this car had? </label><br/>
<label><input type="checkbox" onclick="updateArea(this)">When is the next service and MOT due? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">Is the car still for sale? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">Can I arrange a viewing or test drive? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">Do you do part exchange? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">Do you have any additional pictures? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">Has this car got a full service history? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">Do you offer finance? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">Do you offer warranty? </label> <br/>
<label><input type="checkbox" onclick="updateArea(this)">What's the lowest cash price you'd offer? </label> <br/>
<textarea rows="10" id="area" name="textname" cols="54"></textarea>
<input type="submit">Submit</button>
</div>
</form>
</body>
There are usually multiple ways of doing things, so always clearly detail the requirements, that will make your job way easier to write code and get the task completed.
HTH
