Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Lance Tressler
605
Grid numeric editing browser differences
posted

We have configured various cells in the grid for numeric editing and are enforcing the formatting on display and when the cell changes are saved.

However, we have noticed a significant difference in behavior between the editing behavior of Chromium browsers (Edge and Chrome) and Firefox: in Firefox, the user can enter any alpha character and a spinner is shown but in Chromium this is not the case.

Chromium:

Firefox

We think that it is important for our end users to not have a minor typo prevent entry of the data.

Is there any way for us to get Firefox to behave the same way that Chromium browsers do?

  • 2680
    Verified Answer
    Offline posted
    Hello Lance,

    I have been looking into your question and after investigation determined that this is the default Firefox behavior since version 29. Please, refer to this Stackoverflow post.

     

    As suggested there, the spin buttons can be hidden for Firefox browser by specifying the -moz-appearance of the number type input in CSS like this:

     

    input[type="number"] {
    -moz-appearance: textfield;
}

     

    Regarding entering any alpha character in the input for Firefox browsers, this seems to be an open bug (please refer to Bugzilla Bug 1398528). While the entered non-numerical value would not be submitted, currently the suggestions for improving the user experience around this behavior is implementing some manual validation to make sure the user is informed that the input field is only numerical, or implementing some custom solutions as suggested here.

     

    Best regards,
    Bozhidara Pachilova
    Associate Software Developer