Fellow dashboarders, I found this number mask input component here:-
And although I no longer use Powershell Studio since purchasing UniversalDashboard Professional Edition I did miss the input mask that I had used in previous executable GUI. Not sure about your end users, but mine would add spaces, commas, pound signs etc. Currently apart from validating the control you couldnt say disable all non-numeric keys…well you can now!
So I managed to get this built and working, but didn’t really have a clue on how to bind this to UD so you could read the values of what had been entered…so basically made the component useless…
Then a super-hero team-up involving two different nations occured. @BoSen29 came to the rescue and taught me in the sacred-art of binding to UD.
Then this beautiful component was ready to release:-
This is awesome and something I know I will use often. Is it possible to pass a default value to it? The use case I am thinking is we already had a telephone number for a user and they may only need to change a few digits. Pre-populating it for them would be great.
OK. I have finally had a chance to do some testing on this. This is what I am seeing. Since AutoRefresh is on for the column, it means that it just keeps overwriting the value to that field. If I try to update the field, it will be replaced with the static value after the next refresh.
I guess what I was hoping for was something like what new-udinputfield has with the -defaultvalue field.
@dkkazak never fear help is here well seeming as I put this component out there, and having 4 young daughters gives me very limited testing time, other than the component works, and the parameters passed to it work.
So in the example I posted on github for you, yes indeed with the auto refresh it keeps setting the value back to the value being set via set-udelement…so I put my super thinking cap on
So this will set a default value of 188.8.131.52 if there is currently nothing in the field…however this now allows you to change the values and keep the changed values without over-writing the typed values, as what was happening in the github example.
This may not be the best way…the most prettiest way…or even the smartest way…but it works
Hi @psDevUK, sorry for bringing up an old topic. I was trying to find something like this for a dashboard I’m building. The input fields are going to be dollar amounts and I want to prevent people from entering non numbers. I tried using using the component as follows.
Hey @RamonMA don’t feel bad for bringing up an old thread, sadly I believe the # represents a literal character, so if you know the limit was $1,000.00 you could do ###.## but no it is not possible to just enter a . and skip to the end. However I did release another component https://marketplace.universaldashboard.io/Dashboard/UniversalDashboard.UDField but unlike the official UD version you can give each field a unique ID, then you can do some simple regex to throw a warning if the correct value not entered. I used this component for like 40+ questions on a form, some answers required yes or no and some a value…yeah I could of used a drop down yes or no, but wanted to keep the form looking consistent, same field type throughout. I can post some code if this is a work-around for you?
Appreciate the follow up! And sorry for the late reply, been crazy. I couldn’t get it to work the way I was hoping, so for now, I’m just handling the errors as gracefully as I can. I think the problem is what I’m trying to accomplish, lack of knowledge, but most likely both. My users will enter the price/cost of products, which is normal, but I also have an endpoint refreshing and calculating the margin and margin % and displaying it with different color font depending on the %, before they actually submit the values. I’m still getting some funky errors if someone enters a letter but it’s not breaking, they just close the modal and reopen, it’s a small set of users so I can get away with, you’re using it wrong for now.
Dude trust I know all about crazy…I have 4 daughters! Anyways I was thinking back in the day when I used powershell studio they had a masked input field which let you set some regex…well after reading your post instead of searching for “number field” or “numeric field” I thought I would search for “masked input” and boom I found:- https://www.npmjs.com/package/react-input-mask it’s been a while since I built a component, but I believe I could build this, and let you define the custom regex. It will be slightly different to powershell regex but if you look at the examples you should be able to get the gist of it. So I will add this on my list-of-things-to-do and let you know when it is done @RamonMA
That would be amazing, I greatly appreciate even you looking at it. Correct me where I’m wrong, the input would allow you to only enter characters based on the defined regex? That way I really don’t need to do any input validation when I do a Get-UDElement? Would this also allow an OnChange parameter?
Correct @RamonMA I like to investigate the component, and this one had a demo website, and sure enough if the “REGEX” was defined as a phone number, then it only accepted numbers from the keyboard, so I couldn’t mess it up. So indeed no need for validation. This does look cool, will try to build it over the weekend.
Once again, kudos to @psDevUK for another great component . I’m using the number mask component already and it works great. One thing that would be cool is to allow it to be more dynamic in the format which might be a similar thing that RamonMA was asking about.
I’m looking for a way to have a field to enter a public IP into. As public IP’s aren’t always the same length of numbers it might be a bit confusing for the user. For example:
Public IP: 184.108.40.206
Field format: ###.###.###.###
But for public IP: 220.127.116.11
The user would have to enter: 213.205.240.030
I guess it depends on the limitations of the react component but if it’s possible to have optional formats that would be amazing - Something like:
Format **# . **# . **# . **#
Where * is optional and # is required.