Replacing characters using jQuery

Question

I'm trying to remove commas from all of my textboxes on keyup. I came up with the script below but it's not working. Can anyone see what I am doing wrong?

<script>
    $("input[type='text']").keyup
    (
        function () 
        {
            alert('1');
            $(this).val($(this).val().replace(/[,]/g, ""));
        }
    );
</script>

NOTE: please excuse the $ in Script. SO won't let me post it otherwise...

It looks like someone was able to save it with the correct script tag. Please read the NOTE i have added regarding the $ in script — Abe Miessler, Sep 07 '10 at 18:21
It works fine, you're just missing `$(document).ready`. But why are you using a regex? This is a simple string replacement. — Josh Leitzel, Sep 07 '10 at 18:21
@Josh, String replace only gets the first instance right? I figured this way would allow people to copy in values with multiple commas and remove them all. Does that make sense? — Abe Miessler, Sep 07 '10 at 18:23
Ah, you're right. I forgot about the case in which a user might type two or more commas before lifting the key. — Josh Leitzel, Sep 07 '10 at 18:26
@Abe Miessler: with a reputation of more than 3k you still don't know how to format code in your question? Mark the code in the textfield and press the code button (the one with zeroes and ones in it) or indent the code block with 4 spaces. — jigfox, Sep 07 '10 at 18:27
@jigfox... Yes, with a reputation of more than 3k I DO know how to format code in my question. That's why the code in my question is formatted.... When, I included the script tag it would throw a "connection reset" error. Feel free to add to the meta.SO post i created this morning if you have something of value to contribute... http://meta.stackexchange.com/questions/63728/anyone-else-getting-random-the-connection-was-reset-errors-when-posting-a-quest — Abe Miessler, Sep 07 '10 at 18:32
@Abe Miessler: Sorry, I didn't mean to offense you! I was just wondering. And so I wrote how to format code, because here are a lot of users who don't know. — jigfox, Sep 07 '10 at 19:05

jessegavin · Accepted Answer · 2010-09-07T18:27:12.223

15

You might want to wrap that whole chunk of code in a document ready function

$(function() {
  $("input:text").keyup(function() {
        $(this).val($(this).val().replace(/[,]/g, ""));
  });
});

You can read all about this on the jQuery documentation site.

edited Sep 07 '10 at 18:27

answered Sep 07 '10 at 18:18

jessegavin

74,067
28
136
164

Andy E · Answer 2 · 2010-09-07T18:29:28.997

6

As others have mentioned, make sure you're using $(document).ready() - http://api.jquery.com/ready/. Also, instead of replacing commas on keyup, you should disallow them on keypress by returning false:

$(document.ready(function () { 
    $("input[type=text]").keypress(function (evt) {
        if (String.fromCharCode(evt.which) == ",")
            return false;
    });
});

Example: http://jsfiddle.net/QshDd/

This gives a more professional feel, the "," is blocked without appearing and then disappearing when you release the key. Like your solution, however, this won't catch copying and pasting commas into your input. For that, you can hook into the onpaste or onchange event.

If you want to stick with keyup and replace, you don't really need to mess around with jQuery wrappings, you can access the value property directly:

$(document.ready(function () { 
    $("input[type=text]").keyup(function (evt) {
        this.value = this.value.replace(/,/g, "");
    });
});

edited Sep 07 '10 at 18:29

answered Sep 07 '10 at 18:22

Andy E

338,112
86
474
445

2

+1 for being the only answer to actually give OP a better way of doing what he's trying to do and not just say "wrap in `$(document).ready()`." – Josh Leitzel Sep 07 '10 at 18:33
@Josh: thanks :-) Alas, I fear the OP might have skipped my advice. – Andy E Sep 07 '10 at 18:36
And what about ``? Try tu put [here](http://jsfiddle.net/QshDd/15/) characters like 555s. It doesn't replace only non-numeric character, but whole input. Where is problem? – Ajax Apr 25 '13 at 11:03
1

@Ajax: when an `` has a value that is not a number, its `value` property is an empty string. Therefore, you can't do string replacement for non-numeric characters. I would take a look at the first part of my answer and disallow the erroneous input altogether. – Andy E Apr 25 '13 at 11:24
@Andy E: What a pity... Deleting character looks better, but thanks for the answer, I'll use it. – Ajax Apr 25 '13 at 13:23

score 3 · Answer 3 · answered Sep 07 '10 at 18:19

3

It's working for me: http://jsfiddle.net/vsnrc/1/

answered Sep 07 '10 at 18:19

aularon

11,042
3
36
41

Unfortunately not working with jQuery 3.x ... only with 1.4.x and 2.x ... Any idea how to make this work with jQuery 3.x ? – Levchik Sep 04 '19 at 16:21
1

@Levchik First line needs to change to `$(window).on('load',function(){ ` according to https://stackoverflow.com/questions/37738732/jquery-3-0-url-indexof-error – aularon Sep 04 '19 at 18:26

score 1 · Answer 4 · answered Sep 07 '10 at 18:24

<script>
    $(document).ready(function()
    {
        $("input[type='text']").live('keyup',function () 
        {
            alert('1');
            $(this).val($(this).val().replace(/[,]/g, ""));
        });
    });
</script>

If your input is in an update panel, or added after the binding takes place, this should work.

score 0 · Answer 5 · answered Sep 07 '10 at 18:20

0

Try this

<script>
        $("input[type='text']").keyup
        (
            function () 
            {
                alert('1');
                $(this).val($(this).val().replace(',', ""));
            }
        );
    </script>

answered Sep 07 '10 at 18:20

Maulik Vora

2,544
5
28
48

Replacing characters using jQuery

5 Answers5

Linked