WebTextField - Numeric Validation Mask and Zero Padding

I’m looking for a better way to have a WebTextField to validate that the characters typed into it are numeric and pad the number with leading zeros. The method I’m currently using is the following code in the TextChanged event:

Var i As Integer
Var s As String

If Not IsNumeric(Me.Text) Then
  Session.Alert_PlaySound("beep")
  i = Len(Me.Text)
  s = Left(Me.Text,(i - 1))
  Me.Text = s
End If

If Not (Me.Text = "") Then Me.Text = Format(Me.Text.ToInteger,"00000#")

The problem is it is too slow. If I type 4 or 5 digits in rapid succession some of those digits get stepped on because the TextChanged event is firing and formatting forcing the user to have to type slow enough for each digit text change to process before the next number is typed. Using a number field doesn’t work for me because of the stepper and WebTextField does not have a ValidationMask like DesktopTextField.

If there is a better way to do this or some sort of javascript that will do the validation?

When you say the number field type doesn’t work because of the “Stepper”… what exactly do you mean?

I was thinking that you could use the number field type to only allow the user to type numbers. Then use the LostFocus event to add the zero padding.

It is possible to add a validation mask with JavaScript. I did so in Web 1.0 during my time at BKeeney. That code belongs to Bob and would probably need updates for Web 2.0

The number field in Web 2.0 does not work in that way. It suggests to the browser that the text field is for numbers, and each web browser offers it’s own specific features for that. One of those things that can happen is a stepper that gets added to the UI. It does not restrict data entry to just numbers.

I think Tim adequately answered the number field issue. In Chrome it is presented with an arrow to increment by 1 and clicking that is not a desired feature in addition to it being only suggested as Tim explained.

Using LostFocus to format the padding is not the desired outcome. It will work but does not present the user with the desired experience. I also have to use the padded number to create a second field that is the Job Name that includes a 2 digit year. I’d like all of that to happen in the TextChanged event to populate the job number WebText field I just left that bit of code out above.

If Me.Text = "" Then
  TextField_JobName.Text = ""
  Session.ComplaintJobNumber = ""
  Session.ComplaintJobName = ""
  Button_Find.Enabled = False
  Button_New.Enabled = False
Else
  Me.Text = Format(Me.Text.ToInteger,"00000#")
  TextField_JobName.Text = Me.Text + "-" + Right(Session.ComplaintJobYear,2)
  Session.ComplaintJobNumber = Me.Text
  Session.ComplaintJobName = TextField_JobName.Text
  Button_Find.Enabled = True
  Button_New.Enabled = True
End If

Capture

I can leave it the way it is and tell users to type slowly, but that’s not what I want to do.

Sigh! I have updated the existing case “60792 - WebTextField Validation Mask” submitted by David Cox July 2, 2020. I added a request to also include a post validation format mask like this.
WebTextField1.ValidationMask = “######”
WebTextField1.FormatMask = “00000#”