Special Characters Allowed in JqxNumberInput - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: #, %, $, allow, ie, jqxnumberinput, numberinput, restrict, Special Characters, validation

This topic contains 1 reply, has 2 voices, and was last updated by Nadezhda 9 years, 4 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)

Author

Special Characters Allowed in JqxNumberInput Posts

May 14, 2015 at 9:38 am Special Characters Allowed in JqxNumberInput #71111

iyanark

Participant

Hi,

jqxNumberInput control allow Special Characters like $ % # in Internet Explorer.

Please suggest me how to validate this ?

Thanks
Iyanar K

May 14, 2015 at 11:15 am Special Characters Allowed in JqxNumberInput #71118

Nadezhda

Participant

Hello Iyanar K,

Here is an example which shows how to restrict input special characters like $ and #. I hope it will be helpful to you.

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxtooltip.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxnumberinput.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            // Create jqxNumberInput
            $("#numericInput").jqxNumberInput({ width: '250px', height: '25px', min: 0, max: 1000});
            // Create currency Input.
            $("#currencyInput").jqxNumberInput({ width: '250px', height: '25px', min: 0, max: 1000, symbol: '$'});
            // Create custom validation Input.
            $("#validation").jqxNumberInput({ width: '250px', height: '25px', min: 0, max: 1000, value: 0 });
            $('.jqx-input-content').keypress(function (key) {
                if (key.charCode == 35 || key.charCode == 36) return false;
            });
        });
    </script>
</head>
<body class='default'>
    <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
        <div>The input is restricted from 0 to 1000</div>
        <div style='margin-top: 10px;'>
            Number</div>
        <div style='margin-top: 3px;' id='numericInput'>
        </div>
        <div style='margin-top: 10px;'>
            Currency</div>
        <div style='margin-top: 3px;' id='currencyInput'>
        </div>
        <div style='margin-top: 10px;'>
            Custom Validation Message</div>
        <div style='margin-top: 3px;' id='validation'>
        </div>
    </div>
</body>
</html>

Best Regards,
Nadezhda

jQWidgets team
http://www.jqwidgets.com/

Author

Posts

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.