Text Box Monitor using JQuery

Sometimes, using Text boxes (or other types of controls) you want to keep track of what the user enters. For instance, if they are typing in a barcode (or scanning via a barcode scanner) you do not want them to also press a button, but the app should automatically detect that a barcode was entered and check the item.

In this example a Text box was created, called “TextBox1”. When a user types in values into the text box, the app needs to monitor the text, and then (for this example) when the text is larger than 10 characters, it will do something with the text. In this case, it will output it into the large text area called “TextBox2”.

In order to get this working, a JQuery script was created inside a Javascript function called “JavaScript1” under the Page’s Load Event (“StartPage.Load”). The script looks like this:

A couple of important notes:

  • When referencing TextBox1 you have to add the Page’s name in front with an underscore, StartPage_TextBox1
  • The same with Label1 and Button1
  • Under the if-statement we check if the length is larger than 10. You can change this number to what you require. (mind the spelling of length, took me a long time to found the error when I misspelled length as lenght)
  • We are using the action in Button1 as the action that needs to be performed when the characters reaches more than 10

Download the App here to try it out: TextBoxMonitor.sapz (6.7 KB)
Please note that this was created in Stadium 5.20. Go to https://Stadium.software to download the latest version.