newbie question: trouble with document.selection.createRange();

L

lawrence

Below you'll see some code that I have in one of my forms. I was
hoping to have these buttons and when I click on them they would take
selected text from a textarea box and replace it with the text but
surrounded with the HTML tags I wanted. But I can't get this to work.
Why?









<script language="javascript">
function wrapSelectionBold (element) {
var range = document.selection.createRange();
if (range.parentElement() == element)
range.text = '<b>' + range.text + '<\/b>';
}
function wrapSelectionItalic (element) {
var range = document.selection.createRange();
if (range.parentElement() == element)
range.text = '<i>' + range.text + '<\/i>';
}
function wrapSelectionBlockQuote (element) {
var range = document.selection.createRange();
if (range.parentElement() == element)
range.text = '<blockquote>' + range.text + '<\/blockquote>';
}
function wrapSelectionBigHeadline (element) {
var range = document.selection.createRange();
if (range.parentElement() == element)
range.text = '<h1>' + range.text + '<\/h1>';
}
function wrapSelectionSmallHeadline (element) {
var range = document.selection.createRange();
if (range.parentElement() == element)
range.text = '<h3>' + range.text + '<\/h3>';
}
</script>


<input type="button" value="bold"
onclick="wrapSelectionBold(this.form.inputId2)" />
<input type="button" value="italic"
onclick="wrapSelectionItalic(this.form.inputId2)"/>
<input type="button" value="blockquote"
onclick="wrapSelectionBlockQuote(this.form.inputId2)"/>
<input type="button" value="big headline"
onclick="wrapSelectionBigHeadline(this.form.inputId2)"/>
<input type="button" value="small headline"
onclick="wrapSelectionSmallHeadline(this.form.inputId2)"/>







<div class="formElement">
Change the brief description or introduction for your Weblog; <br>
Or change the contents of your Webpage:<br>
<textarea id="inputId2" name="formInputs[cbMainContent]"
class="textareaInput"> </textarea>
<p>HTML into symbols? <input type="checkbox"
name="formInputs[usingHtml]" value="y" class="textareaCheckbox"></p>

</div>
 
L

lawrence

Mostly I'm wondering if "this.form.inputId2" is the right syntax, or
does it need to be fuller, something with
document.form.element(id).value, etc. What is the best way to go?
 
M

Michael Winter

Mostly I'm wondering if "this.form.inputId2" is the right syntax, or
does it need to be fuller, something with
document.form.element(id).value, etc. What is the best way to go?

Your original question has been answered in the latter version of this
thread. As for the question above, it is best if you use the DOM
collections to access controls that utilise id attributes:

this.form.elements[ 'inputId2' ]

To access a form that uses an id attribute, use

document.forms[ 'formID' ]

Hope that helps,
Mike
 
L

lawrence

Michael Winter said:
Your original question has been answered in the latter version of this
thread. As for the question above, it is best if you use the DOM
collections to access controls that utilise id attributes:

this.form.elements[ 'inputId2' ]

To access a form that uses an id attribute, use

document.forms[ 'formID' ]

Hope that helps,
Mike

Thanks. And if I have only one form on the page, then these two work
about the same?

document.forms[0].elements[ 'inputId2' ]

document.forms[ 'formID' ]
 
M

Michael Winter

[snip]
Thanks. And if I have only one form on the page, then these two work
about the same?

document.forms[0].elements[ 'inputId2' ]

document.forms[ 'formID' ]

Yes. You can use either of the collections (forms and elements) with
indicies, or strings that contain the name or id of the form/control. So
with this HTML snippet:

<body>
...
<form id="myForm">
...
</form>

Both of these expressions return a reference to the same control:

document.forms[ 0 ]
document.forms[ 'myForm' ]

Hope that helps,
Mike
 
L

lawrence

Since one can't grab a selection in Netscape (there is no range() ) is
there a way to find out where the cursor is in a text box and insert
text there?


Michael Winter said:
[snip]
Thanks. And if I have only one form on the page, then these two work
about the same?

document.forms[0].elements[ 'inputId2' ]

document.forms[ 'formID' ]

Yes. You can use either of the collections (forms and elements) with
indicies, or strings that contain the name or id of the form/control. So
with this HTML snippet:

<body>
...
<form id="myForm">
...
</form>

Both of these expressions return a reference to the same control:

document.forms[ 0 ]
document.forms[ 'myForm' ]

Hope that helps,
Mike
 
M

Michael Winter

Since one can't grab a selection in Netscape (there is no range() ) is
there a way to find out where the cursor is in a text box and insert
text there?

Not that I know of (that doesn't necessarily mean there isn't a way).

[snipped top-post]

Mike
 
T

Thomas 'PointedEars' Lahn

lawrence said:
Since one can't grab a selection in Netscape (there is no range() )

There is in versions 6 and above, but it is named different.
is there a way to find out where the cursor is in a text box and
insert text there? [...]

There is. This is a FAQ, please search before you post.
[Top post]

And please do not do that, see the FAQ, too.


PointedEars
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,994
Messages
2,570,223
Members
46,813
Latest member
lawrwtwinkle111

Latest Threads

Top