cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
kmk
Helper V
Helper V

How to stop entering characters in textbox..?

Hi Mates,

we have a requirement, that is users can enter only numbers but not characters in textInput box.

i tired to change type property with "Number" but issue is can not enter comma if textInput box type is Number.

Means user has to enter number along with comma ex...30,20,50 etc but comma can`t enter (not allowing).

 your help is highly appreciated.

7 REPLIES 7
DianaBirkelbach
Super User
Super User

Hi @kmk , 

because the Numbers in Dynamics are not necessarily using the browser settings, I would use office ui fabric (fluent ui) for a number control: https://developer.microsoft.com/en-us/fluentui#/controls/web/textfield . 

There you can specify the needed format.

Otherwise I would take another react number control (maybe if you need the spinning buttons: up/down).

Best regards,

Diana

 

Kind regards,
Diana
----------
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

Hi @DianaBirkelbach 

Thanks for reply.

i really don`t know how to use office/fabric UI in powerapps.

Showcode shows code but i dont think we can add our custom code in powerapps, please let me know how can we add.

 

Hi @kmk,

 

You can check out this video from @a33ik on how to use office-fabric-ui and React with pcf. There is also a Microsoft front end bootcamp (link) that you can use to learn by building a todo app with react and office-fabric-ui.

----------------------------------------------------
If you find this post helpful consider marking it as a solution to help others find it.

Hi @kmk ,

I thought that you mean a PCF (code component), that you can use in a Model or Canvas App.

 

I had a look, and I'm not sure anymore that you can use the office-ui-fabric (fluent ui) TextField, since I don't find the property for the i18n  or pattern. 

 

Making a number control with plain HTML is like looking for trouble. I've found only this (for instance for a german number):

<input name="myinput" value="0" step="0.01" lang="de-DE" type="number" onchange="alert(this.value)"/>

The "lang='de-DE'" should do it, but unfortunately works for me only in Firefox, but not in Chrome. So is not safe to use.

 

A react component that I've already used for a HTMLWebResource in Dynamics365 is "react-number-input": https://www.npmjs.com/package/react-numeric-input , but you would have to format and parse the number by yourself.

 

But if you are not looking for a PCF component, I cannot help much. I don't know how it's done in a CanvasApp without a code component.

 

Best regards,

Diana

Kind regards,
Diana
----------
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

You can use IsMatch function and add regular expression. Something like below.

If(
    IsMatch(
        TextInput1.Text,
        "\d+[\,\.]*\d+",
        MatchOptions.Contains
    ),
    Set(SetText, "Valid"),
    Set(SetText, "Invalid")
)

I have added this on "OnChange" function of Textbox. 


----
Danish Naglekar | Power Maverick
If this post helps, then please consider Accept it as the solution to help the other members.


Power Maverick | Microsoft Business Application MVP

Hi @OOlashyn,

Thanks for reply, it seems like its component development, if yes can we import piece of component in to canvas apps ..?

 

Hi @kmk,

 

Yes, this is a custom component development. Yes, you can import and use your custom components in Canvas Apps (with some exceptions like using Web Api). 

----------------------------------------------------
If you find this post helpful consider marking it as a solution to help others find it.

Helpful resources

Announcements
Ignite 2022

WHAT’S NEXT AT MICROSOFT IGNITE 2022

Explore the latest innovations, learn from product experts and partners, level up your skillset, and create connections from around the world.

Power Apps Africa Challenge 2022

Power Apps Africa Challenge

Your chance to join an engaging competition of Power Platform enthusiasts.

Users online (2,089)