How to show text box entered character length

0
Hello All,   Creating page where need to capture the user entered value lenth on textbox and show that in right-side of text box same page, it should auto reflect on page as per user input character length.
asked
2 answers
0

To achieve this.

1. Add one attribute contentlength  in your entity.

2.call Nanoflow event on your textbox on change event.

3.Inside nanoflow create variable integer and calculate length --length ($object name/attribute)  

3.Do change object in the nanoflow, no need to commit.

4.In textbox property on change behavior you can select when user is entering data and put interval every second.

5.Add new text in you UI and select content length

 

it will display the total character length.

answered
0

Hi Omkar, 

To achieve this in Mendix, you want to create a page where:

  • A user types in a textbox.

  • The number of characters typed is displayed dynamically on the same page, to the right of the textbox.

This can be done using data binding and microflow/nanoflow logic, but the cleanest and most dynamic solution is by using a non-persistent entity and a small JavaScript action or a custom widget.

 

Approach in Mendix Studio Pro

1. Create a Non-Persistent Entity

  • Name: UserInput

  • Attributes:

    • InputText (String)

    • TextLength (Integer)

2. Create a Page

  • Place a Data View with data source: Create object → UserInput

  • Inside the Data View:

    • Add a Text Box bound to InputText

    • Add a Text Widget to show the length — bind it to TextLength

    • Place the TextLength display beside the textbox (use layout grid or CSS styling)

3. Use an OnChange Microflow or Nanoflow

  • Set the On Change event of the Text Box to call a Nanoflow (faster, runs client-side)

  • In the Nanoflow:

    • Use Change Object to set:

      • TextLength = length($UserInput/InputText)

    • Return to the page — the value will auto-update

4. Optional: Use JavaScript for Real-Time Update (Advanced)

 

Mendix doesn’t auto-update on every keystroke unless a custom widget or JS is used.

Result:

  • The user types in the text box.

  • Every time the text changes, TextLength is updated.

  • The updated character count is shown next to the textbox in real-time.

I hope this one helps you! :)

answered