Current filter:
                                You should refresh the page.
                                Support Center
                                0
                                  • Hi,

                                    I'm pretty new to DevExpress MVC and I would like to know how to allow only certain characters (0-9 as well as , and .) in a textbox using the KeyPress event.

                                    Here is what I have so far :

                                    Html.DevExpress().TextBox
                                    (
                                          settings =>
                                          {
                                             settings.Name = "Amount";
                                             settings.Properties.ClientSideEvents.LostFocus = "FormatAmount";
                                             settings.Properties.ClientSideEvents.KeyPress = "IsNumeric";
                                          }
                                    )
                                    .Bind(Model.Amount)
                                    .Render();

                                    function FormatAmount(s, e)
                                    {
                                       if (s.GetText() != "")
                                       {
                                          var amount = parseFloat(s.GetText());
                                          var finalAmount = amount.toFixed(2);
                                          s.SetText(finalAmount);
                                       }
                                    }

                                    function IsNumeric(s, e)
                                    {
                                       //if (keycode is different from [0-9, ".", ","])
                                       //{
                                       // e.returnValue = false;
                                       //}
                                    }

                                    I'm not sure how to access the keycode in the IsNumeric function and couldn't find a similar example, could you please tell me the correct way to use it? I'm open to other solutions too if there's a better way to do it.

                                    Thanks a lot!

                                    Sam

                                0

                                Hi Sam,

                                You can use the e.htmlEvent.keyCode parameter. Please take a look at the attached example E157 for some sample client-side code.
                                I hope this information helps you.

                                Regards,
                                Serge
                                --------------------
                                Check if Search Engine is able to answer questions faster than I do!

                                0

                                Thanks for the example, here's what I now have :

                                Html.DevExpress().TextBox
                                (
                                      settings =>
                                      {
                                         settings.Name = "Amount";
                                         settings.Properties.ClientSideEvents.LostFocus = "FormatAmount";
                                         settings.Properties.ClientSideEvents.KeyPress = "IsNumeric";
                                      }
                                )
                                .Bind(Model.Amount)
                                .Render();

                                function FormatAmount(s, e)
                                {
                                   if (s.GetText() != "")
                                   {
                                      var amount = parseFloat(s.GetText());
                                      var finalAmount = amount.toFixed(2);
                                      s.SetText(finalAmount);
                                   }
                                }

                                function IsNumeric(s, e)
                                {
                                   if (e.htmlEvent.keyCode < 44 || e.htmlEvent.keyCode > 57 || e.htmlEvent.keyCode == 45 || e.htmlEvent.keyCode == 47)
                                   {
                                      alert("invalid character");
                                      e.returnValue = false;
                                   }
                                }

                                I saw the e.returnValue = false statement in another of your examples, should this work or am I doing something wrong?

                                I added an alert just to make sure my if statement is fine and it popped up as expected, but it seems like e.returnValue = false does not work.

                                Thanks!

                                Sam

                                0

                                Hello Sam,

                                I appreciate your reactivation. I have examined this thread and think that you can use a much simpler solution: SpinEdit extension.
                                The extension allows you to enter numeric values only. It can validate user input, as well as format the displayed number.

                                Please check the Data Editors - Spin Edit online demo to see how extension works.

                                Thanks,
                                Vest

                                0

                                Thanks a lot, it works perfectly!

                                0

                                You are always welcome, Sam.

                                Thanks,
                                Vest

                                If you need additional product information, write to us at info@devexpress.com or call us at +1 (818) 844-3383

                                FOLLOW US

                                DevExpress engineers feature-complete Presentation Controls, IDE Productivity Tools, Business Application Frameworks, and Reporting Systems for Visual Studio, along with high-performance HTML JS Mobile Frameworks for developers targeting iOS, Android and Windows Phone. Whether using WPF, Silverlight, ASP.NET, WinForms, HTML5 or Windows 8, DevExpress tools help you build and deliver your best in the shortest time possible.

                                Copyright © 1998-2014 Developer Express Inc.
                                All trademarks or registered trademarks are property of their respective owners