Search code examples
jqueryvalidationisnumeric

jQuery: what is the best way to restrict "number"-only input for textboxes? (allow decimal points)


What is the best way to restrict "number"-only input for textboxes?

I am looking for something that allows decimal points.

I see a lot of examples. But have yet to decide which one to use.

Update from Praveen Jeganathan

No more plugins, jQuery has implemented its own jQuery.isNumeric() added in v1.7. See: https://stackoverflow.com/a/20186188/66767


Solution

  • Update

    There is a new and very simple solution for this:

    It allows you to use any kind of input filter on a text <input>, including various numeric filters. This will correctly handle Copy+Paste, Drag+Drop, keyboard shortcuts, context menu operations, non-typeable keys, and all keyboard layouts.

    See this answer or try it yourself on JSFiddle.

    jquery.numeric plugin

    I've successfully implemented many forms with the jquery.numeric plugin.

    $(document).ready(function(){
        $(".numeric").numeric();
    });
    

    Moreover this works with textareas also!

    However, note that Ctrl+A, Copy+Paste (via context menu) and Drag+Drop will not work as expected.

    HTML 5

    With wider support for the HTML 5 standard, we can use pattern attribute and number type for input elements to restrict number only input. In some browsers (notably Google Chrome), it works to restrict pasting non-numeric content as well. More information about number and other newer input types is available here.