0

I have a Fluid Problem.

This code:

<f:form.textfield class="wettersuchinput" maxlength="4" type="email" name="zip" value="{zip}" placeholder="PLZ für Lokalwetter eingeben"/>

I want to fill just numbers in this input textfield. I tried to change the type in numbers, but that's not that i want to.

Can anybody help me to allow just numbers in this textfield ?

I am looking for a soluthion without viewhelper.

Thank you

zoom23
  • 694
  • 2
  • 10
  • 23

1 Answers1

0

Use the attribute pattern on the input field:

<f:form.textfield maxlength="4" name="zip" value="{zip}" additionalAttributes="{pattern: '[0-9]{4}'}"/>

The allows only inputs consisting of exactly four digits. If the input is valid or not may be checked by the CSS pseudo-classes :valid and :invalid.

Of course this won't work in all browsers (yes, I am looking at you, IE), and it does not help you with security - a malevolent user can easily circumvent this. Use the server side validation for security.

Jost
  • 5,948
  • 8
  • 42
  • 72
  • This `pattern` attribute launches an exception: `#1237823695: Argument "pattern" was not registered.` – Memochipan Jun 13 '16 at 22:11
  • Ok, this is an error in the answer - use `additionalAttributes` instead: ``. Answer is corrected. – Jost Jun 14 '16 at 04:50
  • This is not working with TYPO3 8.X or am I wrong? Don't care if I use the pattern="(\d+(\.\d{3})*)(,(\d{2})){1}" or additionalAttributes="{pattern:'(\d+(\.\d{3})*)(,(\d{2})){1}'}" syntax, TYPO3 will remove the parts: "{1}", "{2}" and "{3}" from my pattern :(. It seems cdata will not help anymore, too :(. I have found a solution: escape curly backets with format raw viewhelper, see https://stackoverflow.com/questions/43425008/cdata-not-working-in-typo3-v8-fluid. – Fox Jan 15 '18 at 16:55
  • The parts in curly braces are interpreted as variable references, and thus `{3}` will be replaced by the content of variable `3`. As `3` is likely not defined (and not even a valid variable name?), it is replaced by the empty string. Using `f:format.raw` is the way to solve this problem - just make sure you don't introduce XSS problems into your site with it. – Jost Jan 15 '18 at 17:07