Forum Moderators: open
Any ideas?
cmatcme
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
function addtext(){
if (document.getElementById){
document.getElementById('myform').getElementsByTagName('textarea').item(0).innerHTML="Hello world!";
}
}
</script>
</head>
<body>
<p><a href="#" onclick="addtext();">click</a></p>
<form id="myform">
<textarea> </textarea></form>
</body>
</html>
Your entire function action is dependent on getElementById() and testing for it with if(~) doesn't really accomplish anything, in this case. It flies or it doesn't, one way or the other.
You might as well give the id to the textarea and address it directly, as in: document.getElementById('txtAreaId').innerHTML
To add to the contents already in the textarea, use += rather than =. Now controlling where the default insertion point is between browsers, that's an issue for Mr. Marx to address.
The code works fine - until I try adapting it in my page. My page is an asp file
<!-- 3 CSS DOCS AND 1 TITLE -->
<script type="text/javascript">
function open(){
if (document.getElementById){
document.getElementById('create1').getElementsByTagName('textarea').item(4).innerHTML="<br>";
}
}
</script>
<!-- PAGE TITLE, END HEAD, BEGIN BODY -->
<!-- HEADER AND INSTRUCTIONS -->
<form method=post action=ownpage.asp?pagetype=builderview id='create1'>
<input type='text' name='title' value='Your Title Of You Page Here' size='35'><br>
<input type='text' value='CSS Document Source' name='css'><br>
<input type='text' name='background' value='Background Colour'><br>
<input type='text' name='header' value='Your Main Header In Here' size='35'><br>
<input type="button" onClick="addtext();" value="New Line"> <br>
<textarea name='create1' rows='13' cols='35'>Your Text or HTML BODY Code</textarea><br>
<input type='text' name='creator' value='Your Name' size='35'><br><br>
<input type='submit' value='Create' size='35'></form><form action='ownpage.asp'><input type='submit' value='Code Create' name='pagetype'></form>
<!-- END PAGE -->
It's meant (when clicked) to add the <br>eak tag to the texarea for those who have no idea how to html. It doesn't succeed. What is does do is go to the same page and create a blank page.
Any help. Is it because I'm using asp with it?
If nothing is selected, it prompts you to select.
An easier way to do a <br> is just a link and do "edit_text.value+='<br>';
You'll have the change all the [ and ]'s to < and > for normal HTML. May have some incomplete items, pasted from a current project.
<form name="test_form">
<select name="DD" OnChange="javascript:selectStyle(test_form.edit_text,this.options[this.selectedIndex].value);">
<option value="">Select Color</option>
<option value="color:Black">Black</option>
<option value="color:Blue">Blue</option>
<option value="color:BlueViolet">BlueViolet</option>
</select>
<select name="DD" OnChange="javascript: selectStyle(test_form.edit_text,this.options[this.selectedIndex].value,this);">
<option value="">Select Style</option>
<option value="font-weight:700">Bold</option>
<option value="font-style:italic">Italic</option>
<option value="font-style:italic;font-weight:700">Bold Italic</option>
<option value="font-weight:700;color:red">Red Bold</option>
<option value="br">Line Break</option>
<option value="p">P</option>
<option value="h3">H3</option>
<option value="h4">H4</option>
<option value="ul">Bullet List</option>
<option value="ol">Numeric List</option>
<option value="li">List Item</option>
</select>
<textarea name="edit_text" rows=20 cols=35 wrap=soft></textarea>
</form>
<script language="javascript">
function selectStyle(theField,style,dd) {
var ind = 0;
var next = 0;
var term = '';
var span,spanclose,align;
if (style == '') { return; }
if (style == 'br') {
span = '';
spanclose = '['+style+']';
}
else if ((style == 'ul') ¦¦ (style == 'ol') ¦¦ (style == 'p') ¦¦
(style == 'li') ¦¦ (style == 'h3') ¦¦ (style == 'h4')) {
span = '['+style;
if ((style == 'h3') ¦¦ (style == 'h4')) {
align= confirm('Cick OK or press ENTER to align CENTER, CANCEL or press ESC to align LEFT.',true);
if (align==true) { span += ' align="center"'; }
}
span +=']';
spanclose = '[\/'+style+']';
}
else {
span = '[SPAN STYLE="'+style+';"]';
spanclose = '[\/SPAN]';
}
var allText = theField.value;
// IE
if (document.selection) {
var selectedText = document.selection;
if (selectedText.type!= 'Text') {
var msg = 'Enter the text to apply style to, or cancel and select text from the text area.'
var b = prompt(msg,'This will be added to the END of your text block.');
if (! b) { if (dd) { dd.selectedIndex = 0; } return; }
theField.value = theField.value + '\n' + span + b + spanclose;
}
else {
var sel = document.selection.createRange();
document.selection.createRange().text = span + sel.text + spanclose;
}
}
//NN
else if (theField.selectionStart) {
var startPos = theField.selectionStart;
var endPos = theField.selectionEnd;
if (startPos == endPos) {
var msg = 'Enter the text to apply style to, or cancel and select text from the text area.'
var b = prompt(msg,'');
if (! b) { if (dd) { dd.selectedIndex = 0; } return; }
theField.value = theField.value + '\n' + span + b + spanclose;
}
else {
theField.value = allText.substring(0, startPos)+
span+theField.value.substring(startPos, endPos)+spanclose+
allText.substring(endPos, theField.value.length);
}
}
// Get a 4+ browser.
else {
msg = 'Dynamic text field editing is not supported in your browser.\n'+
'Enter the text to be marked up below and it will be added at the\n'+
'end of the text block. You will have to cut it from there and\n'+
'paste where you want it.';
var b = prompt(msg,'');
if (! b) { return; }
theField.value = theField.value + '\n' + span + b + spanclose;
}
if (dd) { dd.selectedIndex = 0; }
}
</script>
<script type="text/javascript">
function open(){
document.getElementById('create1').getElementsByTagName('textarea').item(0).innerHTML="<br>";
}
</script>
