470,647 Members | 1,248 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 470,647 developers. It's quick & easy.

How to delete a character at the caret? Extend selection?

I have a text field in a form. I want the user to be able to click
a DELETE button and have the character at the cursor position deleted.
This would be just as if the user had pressed the Back Space key on the
keyboard... But this is for a kiosk application with no keyboard :-(
so I need to program a delete button.

I have code that lets me insert text at the cursor position.
And I can move the ABSOLUTE cursor position from the start and end.
For example, if my text field looks like this (With | representing the caret):
ABCDEF|GHIJKL
....and I call moveStart('character', 1) I get this:
A|BCDEFGHIJKL

I was hoping that I could move the selection RELATIVE to the current position:
var r = my_field.createTextRange();
r.moveStart('character', -1); // This doesn't work...
r.select();
r.text = "";
Or if I could at least get the cursor or selection coordinates:
var r = my_field.createTextRange();
var LEFT = r.start; // This doesn't work
r.moveStart('character', LEFT-1);
r.select();
r.text = "";
Mozilla lets you get the selectionStart, but I can't figure out how to
do this for IE. Is there anything like selectionStart in IE?

Yours,
Noah
Jul 20 '05 #1
3 6171
Noah wrote:
I have a text field in a form. I want the user to be able to click
a DELETE button and have the character at the cursor position deleted.
This would be just as if the user had pressed the Back Space key on the
keyboard... But this is for a kiosk application with no keyboard :-(
so I need to program a delete button.
I have code that lets me insert text at the cursor position. [] I was hoping that I could move the selection RELATIVE to the current position:
var r = my_field.createTextRange();
have you tried

var r=document.selection.createRange()

instead of that?
r.moveStart('character', -1); // This doesn't work...
r.select();
r.text = "";


There are many ways achieving what you want.
Probably the dumbest using the inverse logic of the direction of
deletion would be:

get selection,
move one character backwards r.move('character', -1)
and then execCommand('Delete')
HTH

--
marekmand.kuubik.ee | Marek Mand
Jul 20 '05 #2
Marek Mand <ca********@mail.ee> wrote in message news:<c2*************@ID-27552.news.uni-berlin.de>...
have you tried

var r=document.selection.createRange()


Ah! That was the trick. I get createRange and createTextRange mixed up.
This should also work for moving the cursor left and right; although,
I'm not sure how I will get cursor up and cursor down to work.

The full code for Back Space follows.
There is extra logic because the BackSpace key behaves differently if
there is already a selected range. The only drawback I found
is that the caret is hidden after this. The field still has focus
and any new typing will reveal the caret, but the caret is hidden until then.
// This emulates the Back Space (BkSP) key in JavaScript for IE.
var r = document.selection.createRange();
if (r.text.length == 0) { // Select one character to the left of caret.
r.move('character', -1);
r.moveEnd ('character', 1);
}
r.execCommand ('Delete');
r.execCommand ('Unselect');
Note: if you want Delete (del) key behavior instead of BkSpc then don't
execute the r.move('character',-1) line of code.

Now I just have to figure out how to do this in Mozilla :-P
Will there ever be a unified DOM?

Yours,
Noah
Jul 20 '05 #3
Noah wrote:
Marek Mand <ca********@mail.ee> wrote in message news:<c2*************@ID-27552.news.uni-berlin.de>...
have you tried
var r=document.selection.createRange() Ah! That was the trick. I get createRange and createTextRange mixed up.
This should also work for moving the cursor left and right; although,
I'm not sure how I will get cursor up and cursor down to work.

up? down? mm, aha you have a textarea...
this will be quite tricky, as IHMO move('caracter') is broken there.
But that is only my personal opinion.

The full code for Back Space follows.
As you were so nice and posted back so the others can learn from it,
which is quite rare nowadays
There is extra logic because the BackSpace key behaves differently if
there is already a selected range. The only drawback I found
is that the caret is hidden after this. The field still has focus
and any new typing will reveal the caret, but the caret is hidden until then. [code]

then I take and answer also this.
The aswer for your problem probably is:

r.select();

after finishing the programmatic editing operations.
If it doesnt work, then do tell me.

// This emulates the Back Space (BkSP) key in JavaScript for IE.
var r = document.selection.createRange();
if (r.text.length == 0) { // Select one character to the left of caret.
r.move('character', -1);
r.moveEnd ('character', 1);
have you tried now a single moveStart('character', -1);
instead of those two statements?
}
r.execCommand ('Delete');
r.execCommand ('Unselect');
Note: if you want Delete (del) key behavior instead of BkSpc then don't
execute the r.move('character',-1) line of code. Now I just have to figure out how to do this in Mozilla :-P Will there ever be a unified DOM?


Why are you so mean and demand for salary cuts, what on earth do you
have on your mind? ;D

p.s.
I am not an active reader of cljs for some years now, so do tell if you
are done with this thread.

--
marekmand
EU, Estonia, Tallinn | marekmand.kuubik.ee
Jul 20 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by randy | last post: by
7 posts views Thread by One Handed Man [ OHM# ] | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.