Get input character position in contenteditable
I have a contenteditale div in my Angular 6 project
<div contenteditable="true" (input)="checkContent($event)"></div>
When user types a character, I would like to get the position of the character.
What I'm actualy trying to do is to check if there is a '@' before the input character and If yes then count characters between '@' and input character
Examples(considering the Uppercase character is the last entered):
hellO // postion = 4
hello World // postion = 6
Hello world // postion = 0
For now I can get the entered character from the component with event.data
checkContent(event: any){
console.log(event.data);
}
How can I get the position of the last entered character ?
javascript angular contenteditable
|
show 7 more comments
I have a contenteditale div in my Angular 6 project
<div contenteditable="true" (input)="checkContent($event)"></div>
When user types a character, I would like to get the position of the character.
What I'm actualy trying to do is to check if there is a '@' before the input character and If yes then count characters between '@' and input character
Examples(considering the Uppercase character is the last entered):
hellO // postion = 4
hello World // postion = 6
Hello world // postion = 0
For now I can get the entered character from the component with event.data
checkContent(event: any){
console.log(event.data);
}
How can I get the position of the last entered character ?
javascript angular contenteditable
Can you clarify one thing, once any character is entered from where you have to match the position ? I mean which string or content ?
– ngChaitanya
Nov 17 '18 at 14:06
What is your actual use case?
– charlietfl
Nov 17 '18 at 14:08
@ngChaitanya from the contenteditable first character
– Amadou Beye
Nov 17 '18 at 14:18
@charlietfl I just want the input character position as described in example
– Amadou Beye
Nov 17 '18 at 14:19
But that may not be trivial depending on what you are trying to accomplish. Without more background there is no simple answer or answers may not meet your needs. You mentioning typing, but what about pasting for example? Or corrections user makes ? A proper explanation of the higher level problem you are trying to solve would help
– charlietfl
Nov 17 '18 at 14:21
|
show 7 more comments
I have a contenteditale div in my Angular 6 project
<div contenteditable="true" (input)="checkContent($event)"></div>
When user types a character, I would like to get the position of the character.
What I'm actualy trying to do is to check if there is a '@' before the input character and If yes then count characters between '@' and input character
Examples(considering the Uppercase character is the last entered):
hellO // postion = 4
hello World // postion = 6
Hello world // postion = 0
For now I can get the entered character from the component with event.data
checkContent(event: any){
console.log(event.data);
}
How can I get the position of the last entered character ?
javascript angular contenteditable
I have a contenteditale div in my Angular 6 project
<div contenteditable="true" (input)="checkContent($event)"></div>
When user types a character, I would like to get the position of the character.
What I'm actualy trying to do is to check if there is a '@' before the input character and If yes then count characters between '@' and input character
Examples(considering the Uppercase character is the last entered):
hellO // postion = 4
hello World // postion = 6
Hello world // postion = 0
For now I can get the entered character from the component with event.data
checkContent(event: any){
console.log(event.data);
}
How can I get the position of the last entered character ?
javascript angular contenteditable
javascript angular contenteditable
edited Nov 17 '18 at 14:34
Amadou Beye
asked Nov 17 '18 at 14:03
Amadou BeyeAmadou Beye
932515
932515
Can you clarify one thing, once any character is entered from where you have to match the position ? I mean which string or content ?
– ngChaitanya
Nov 17 '18 at 14:06
What is your actual use case?
– charlietfl
Nov 17 '18 at 14:08
@ngChaitanya from the contenteditable first character
– Amadou Beye
Nov 17 '18 at 14:18
@charlietfl I just want the input character position as described in example
– Amadou Beye
Nov 17 '18 at 14:19
But that may not be trivial depending on what you are trying to accomplish. Without more background there is no simple answer or answers may not meet your needs. You mentioning typing, but what about pasting for example? Or corrections user makes ? A proper explanation of the higher level problem you are trying to solve would help
– charlietfl
Nov 17 '18 at 14:21
|
show 7 more comments
Can you clarify one thing, once any character is entered from where you have to match the position ? I mean which string or content ?
– ngChaitanya
Nov 17 '18 at 14:06
What is your actual use case?
– charlietfl
Nov 17 '18 at 14:08
@ngChaitanya from the contenteditable first character
– Amadou Beye
Nov 17 '18 at 14:18
@charlietfl I just want the input character position as described in example
– Amadou Beye
Nov 17 '18 at 14:19
But that may not be trivial depending on what you are trying to accomplish. Without more background there is no simple answer or answers may not meet your needs. You mentioning typing, but what about pasting for example? Or corrections user makes ? A proper explanation of the higher level problem you are trying to solve would help
– charlietfl
Nov 17 '18 at 14:21
Can you clarify one thing, once any character is entered from where you have to match the position ? I mean which string or content ?
– ngChaitanya
Nov 17 '18 at 14:06
Can you clarify one thing, once any character is entered from where you have to match the position ? I mean which string or content ?
– ngChaitanya
Nov 17 '18 at 14:06
What is your actual use case?
– charlietfl
Nov 17 '18 at 14:08
What is your actual use case?
– charlietfl
Nov 17 '18 at 14:08
@ngChaitanya from the contenteditable first character
– Amadou Beye
Nov 17 '18 at 14:18
@ngChaitanya from the contenteditable first character
– Amadou Beye
Nov 17 '18 at 14:18
@charlietfl I just want the input character position as described in example
– Amadou Beye
Nov 17 '18 at 14:19
@charlietfl I just want the input character position as described in example
– Amadou Beye
Nov 17 '18 at 14:19
But that may not be trivial depending on what you are trying to accomplish. Without more background there is no simple answer or answers may not meet your needs. You mentioning typing, but what about pasting for example? Or corrections user makes ? A proper explanation of the higher level problem you are trying to solve would help
– charlietfl
Nov 17 '18 at 14:21
But that may not be trivial depending on what you are trying to accomplish. Without more background there is no simple answer or answers may not meet your needs. You mentioning typing, but what about pasting for example? Or corrections user makes ? A proper explanation of the higher level problem you are trying to solve would help
– charlietfl
Nov 17 '18 at 14:21
|
show 7 more comments
2 Answers
2
active
oldest
votes
How about using the keydown
and keyup
event to get the difference between 2 strings, then you will find exactly the index of last character.
add a comment |
If I understand what you want correctly, then this works...
1 - Insert a temporary span (with an id) at the cursor position that contains a character you will never type (I use hex 7F).
2 - Get the textContent (innerText) of your div into a Variable.
3 - Delete the temporary span.
4 - Use Variable.search(/x7F/) (in my example) to get position of current character.
1
can you please give me an example sir ?
– Amadou Beye
Nov 17 '18 at 17:05
Frankly, no, I'm not going to write your script for you - which part of this are you struggling with?
– Tony Duffill
Nov 18 '18 at 19:04
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53351952%2fget-input-character-position-in-contenteditable%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
How about using the keydown
and keyup
event to get the difference between 2 strings, then you will find exactly the index of last character.
add a comment |
How about using the keydown
and keyup
event to get the difference between 2 strings, then you will find exactly the index of last character.
add a comment |
How about using the keydown
and keyup
event to get the difference between 2 strings, then you will find exactly the index of last character.
How about using the keydown
and keyup
event to get the difference between 2 strings, then you will find exactly the index of last character.
answered Nov 17 '18 at 14:40
Son Tr.Son Tr.
12318
12318
add a comment |
add a comment |
If I understand what you want correctly, then this works...
1 - Insert a temporary span (with an id) at the cursor position that contains a character you will never type (I use hex 7F).
2 - Get the textContent (innerText) of your div into a Variable.
3 - Delete the temporary span.
4 - Use Variable.search(/x7F/) (in my example) to get position of current character.
1
can you please give me an example sir ?
– Amadou Beye
Nov 17 '18 at 17:05
Frankly, no, I'm not going to write your script for you - which part of this are you struggling with?
– Tony Duffill
Nov 18 '18 at 19:04
add a comment |
If I understand what you want correctly, then this works...
1 - Insert a temporary span (with an id) at the cursor position that contains a character you will never type (I use hex 7F).
2 - Get the textContent (innerText) of your div into a Variable.
3 - Delete the temporary span.
4 - Use Variable.search(/x7F/) (in my example) to get position of current character.
1
can you please give me an example sir ?
– Amadou Beye
Nov 17 '18 at 17:05
Frankly, no, I'm not going to write your script for you - which part of this are you struggling with?
– Tony Duffill
Nov 18 '18 at 19:04
add a comment |
If I understand what you want correctly, then this works...
1 - Insert a temporary span (with an id) at the cursor position that contains a character you will never type (I use hex 7F).
2 - Get the textContent (innerText) of your div into a Variable.
3 - Delete the temporary span.
4 - Use Variable.search(/x7F/) (in my example) to get position of current character.
If I understand what you want correctly, then this works...
1 - Insert a temporary span (with an id) at the cursor position that contains a character you will never type (I use hex 7F).
2 - Get the textContent (innerText) of your div into a Variable.
3 - Delete the temporary span.
4 - Use Variable.search(/x7F/) (in my example) to get position of current character.
answered Nov 17 '18 at 16:54
Tony DuffillTony Duffill
20315
20315
1
can you please give me an example sir ?
– Amadou Beye
Nov 17 '18 at 17:05
Frankly, no, I'm not going to write your script for you - which part of this are you struggling with?
– Tony Duffill
Nov 18 '18 at 19:04
add a comment |
1
can you please give me an example sir ?
– Amadou Beye
Nov 17 '18 at 17:05
Frankly, no, I'm not going to write your script for you - which part of this are you struggling with?
– Tony Duffill
Nov 18 '18 at 19:04
1
1
can you please give me an example sir ?
– Amadou Beye
Nov 17 '18 at 17:05
can you please give me an example sir ?
– Amadou Beye
Nov 17 '18 at 17:05
Frankly, no, I'm not going to write your script for you - which part of this are you struggling with?
– Tony Duffill
Nov 18 '18 at 19:04
Frankly, no, I'm not going to write your script for you - which part of this are you struggling with?
– Tony Duffill
Nov 18 '18 at 19:04
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53351952%2fget-input-character-position-in-contenteditable%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Can you clarify one thing, once any character is entered from where you have to match the position ? I mean which string or content ?
– ngChaitanya
Nov 17 '18 at 14:06
What is your actual use case?
– charlietfl
Nov 17 '18 at 14:08
@ngChaitanya from the contenteditable first character
– Amadou Beye
Nov 17 '18 at 14:18
@charlietfl I just want the input character position as described in example
– Amadou Beye
Nov 17 '18 at 14:19
But that may not be trivial depending on what you are trying to accomplish. Without more background there is no simple answer or answers may not meet your needs. You mentioning typing, but what about pasting for example? Or corrections user makes ? A proper explanation of the higher level problem you are trying to solve would help
– charlietfl
Nov 17 '18 at 14:21