How to replace dot(.) into special character "।" on only dot(.) keypress

Question

I to replace dot(.) into special character "।" on only dot(.) keypress.

I don't have much knowledge of coding.

I found a function, but when I paste a text file in the text area, it replaces all dots that are present in a text file into special characters "।".

If I am wrong, please edit or suggest the appropriate code in the code.

<!doctype html>
<html dir='ltr' lang='en-GB'>

<head>
  <meta charset="UTF-8">
  <title>test page</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script>
    $(function() {
      $('textarea').on("keyup", function(e) {
        var val = $(this).val();
        var str = val.replace('.', '।');
        $(this).val(str);
      });
    });
  </script>
</head>

<body>
  <textarea></textarea>
</body>

</html>

@SebastianSimon ```input``` instead of ```keyup``` is not going to fix it. — prettyInPink, Nov 21 '21 at 13:00
@prettyInPink , sir input paste not worked. It is neither converting dot into '।' — Mohammad Suhail, Nov 21 '21 at 13:11
Using `"input"` is just general advice. I’m still not quite sure what you’re trying to do. If you’re trying to replace _all_ instances, then `.replace('.', '।')` is not enough. Please read the documentation: [`replace`](//developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String/replace), [`replaceAll`](//developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String/replaceAll), [regular expressions](//developer.mozilla.org/docs/Web/JavaScript/Guide/Regular_Expressions). — Sebastian Simon, Nov 21 '21 at 13:13
what about key press and hold, it produces a lot of `dot`, keep or replace last one only? — ProDec, Nov 21 '21 at 13:21
@MohammadSuhail [What Do You Mean “It Doesn’t Work”?](//meta.stackexchange.com/q/147616/289905) `"input"` instead of `"keyup"` and `replaceAll` instead of `replace` seems to replace all instances of `.` by `।` just fine. [Edit] your post and provide a [mre]. Please try using the [debugging capabilities](//ali-dev.medium.com/how-to-easily-debug-in-javascript-5bac70f94f1a) of your browser. Use the [browser console (dev tools)](//webmasters.stackexchange.com/q/8525) (hit `F12`) and read any errors. This is at least your fifth question on this topic… — Sebastian Simon, Nov 21 '21 at 13:21
@SebastianSimon, Sorry Sir, "input" instead of "keyup" and replaceAll instead of replace replaces all of . by । but we need only to replace . by on dot key press not those dot when I paste a text file and present . like 2.3, it should remain as its and dont convert like 2।3 — Mohammad Suhail, Nov 21 '21 at 13:31
@ProGu How to replace the last one dot only with special character — Mohammad Suhail, Nov 21 '21 at 13:43
@SebastianSimon I don't have much knowledge of coding. I am not getting the desired result. I need to replace the last dot only into "।" so that all previously dot present in numbers like 3.5 and 4.667 don't change — Mohammad Suhail, Nov 21 '21 at 13:54
You `insertAtCaret` from [this answer](https://stackoverflow.com/a/45637036/2181514) and `if (e.key === '.') { $('textarea#comment').insertAtCaret("|"); e.preventDefault(); }` — freedomn-m, Nov 21 '21 at 17:29
Does this answer your question? [replace typed character](https://stackoverflow.com/a/45637036/2181514) — freedomn-m, Nov 21 '21 at 17:29

score 2 · Answer 1 · answered Nov 21 '21 at 13:53

2

To replace last . just key in. It does not handle the case when pressing dot and hold.

$(function() {
  $('textarea').on("keyup", function(e) {
    if (e.key === '.') {
      const index = this.selectionStart;
      const text = $(this).val();
      if (index > 0 && text.charAt(index - 1) === '.') {
        $(this).val(text.substr(0, index - 1) + '|' + text.substr(index));
        this.selectionStart = index;
        this.selectionEnd = index;
      }
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea></textarea>

answered Nov 21 '21 at 13:53

ProDec

5,390
1
3
12

Million thanks, I got the last dot replaced into | character but I need to shift a place left remove one spaces/lettter in left side – Mohammad Suhail Nov 21 '21 at 14:32
How to remove left side white space or letter when we press dot key like abcd | become abcd| or abcd| become abc| in the above code – Mohammad Suhail Nov 22 '21 at 16:50

prettyInPink · Accepted Answer · 2021-11-22T18:37:36.990

1

Replacing the last character if the input was a dot should fix it:

$(this).val($(this).val().replace(/.$/,"|"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
    jQuery.fn.extend({
      insertAtCaret: function(insert) {
        var el = this[0]; // get DOM element instead of jQuery object
        if (document.selection) {
          // IE
          sel = document.selection.createRange();
          sel.text = insert;
        } else if (el.selectionStart || el.selectionStart == '0') {
          // other browsers
          var startPos = el.selectionStart;
          var endPos = el.selectionEnd;
          el.value = el.value.substring(0, startPos) + insert + el.value.substring(endPos, el.value.length);
          el.setSelectionRange(endPos + insert.length, endPos + insert.length); // put the cursor at the end of the inserted text
        } else {
          // last resort, shouldn't ever get here
          this[0].value += insert;
        }
      }
    })
  $(function() {
    $('textarea').on("keydown", function(e) {

       if(e.key==='.'){
         e.preventDefault();
         $('textarea').insertAtCaret("|");
          //$(this).val($(this).val().substring(0, $(this).val().length - 1)+'|');
       }

    });
    

  });
</script>
<textarea></textarea>

edited Nov 22 '21 at 18:37

answered Nov 21 '21 at 13:52

prettyInPink

3,291
3
21
32

Million thanks, I got the last dot replaced into | character but I need to shift a place left with remove one spaces/lettter in left side – Mohammad Suhail Nov 21 '21 at 14:31
@MohammadSuhail, not sure what you mean, please elaborate a little more. – prettyInPink Nov 21 '21 at 14:53
if we type abcd and press shift key and then dot key, we will get abcd | but we need abcd and after that dot key, we will get abcd| but we need abc| means shift left and remove nearby letter or spaces in left – Mohammad Suhail Nov 21 '21 at 15:14
1

@MohammadSuhail, I believe the update fixes what you need. – prettyInPink Nov 21 '21 at 15:24
@ prettyInPink, Yes it helps a lot, but if we type abcd and press shift key and then dot key, we will get abcd | but we need abcd| and if we type abcd after that dot key, we will get abcd| but we need abc| means shift left and remove nearby letter or spaces in left, it will solve my complete problem if we add this functionallity – Mohammad Suhail Nov 21 '21 at 15:32
@ prettyInPink, I got it by adding inputVal = inputVal + '|' + " "; – Mohammad Suhail Nov 21 '21 at 15:37
@ prettyInPink, Million Thanks once again – Mohammad Suhail Nov 21 '21 at 15:38
1

You really shouldn't ever use `.val(newval)` in an input's keyup because it moves the caret which becomes extremely annoying *very* quickly. – freedomn-m Nov 21 '21 at 17:25
1

@freedomn-m, is the above a better approach? – prettyInPink Nov 21 '21 at 17:36
@freedomn-m, I meant the updated. – prettyInPink Nov 21 '21 at 17:39
Well, the `e.preventDefault();` stops the "." being added, but it's about not moving the position of the caret - where the input cursor is. eg type "abc" then press left and "." and you get "abc|" instead of "ab|c" – freedomn-m Nov 21 '21 at 17:40
@freedomn-m Okay, indeed, I hadn't thought of that, so one would track the caret position and include it as well, I assume? – prettyInPink Nov 21 '21 at 17:42
@freedom-m , I got the desired result by adding inputVal = inputVal + '|' + " "; in the previous script – Mohammad Suhail Nov 21 '21 at 17:46
@MohammadSuhail, post your answer :) – prettyInPink Nov 21 '21 at 17:47
Use `insertAtCaret` from [this answer](https://stackoverflow.com/questions/45635745/replace-just-typed-character-a-with-ab/45637036#45637036) and `if (e.key === '.') { $('textarea#comment').insertAtCaret("|"); e.preventDefault(); }` – freedomn-m Nov 22 '21 at 08:50
@freedom-m, what is the use of this code – Mohammad Suhail Nov 22 '21 at 10:19
1

@freedomn-m, I have included the suggest, issue is though that the OP requested the previous character to be removed, not just space, but any character. Converting: abcd. to abc| – prettyInPink Nov 22 '21 at 18:38
@prettyInPink , Sir It works fine but when we want to do in some of the previous lines in textarea, we are not able to Convert: abcd. to abc| and also not able to insert | – Mohammad Suhail Nov 23 '21 at 03:41

How to replace dot(.) into special character "।" on only dot(.) keypress

2 Answers2