Camp de número
Recopila números amb precisió i estil. Des de simples entrades numèriques fins a controls lliscants interactius amb format de moneda, el camp Número proporciona validació, format i una experiència d'usuari atractiva.
Recopilació de números intel·ligents amb validació integrada
Perfecte per:
Funcions potents per a cada cas d'ús
🎯 Control de validació precís
Límits mínims/màxims
Estableix els valors permesos més baixos i més alts. Evita les entrades no vàlides abans de l'enviament amb la validació integrada del navegador.
Control de la mida del pas
Definiu valors d'increment: nombres enters (1), semipassos (0.5) o decimals precisos (0.01) per a la moneda.
Exemples:
- Camp d'edat: Mín. 18, Màx. 100, Pas 1
- Camp de preu: Mín. 0, Màx. 10000, Interval 0.01
- Valoració: Mín 1, Màx 5, Pas 0.5
💰 Format intel·ligent de números
Múltiples opcions de format:
- Número pla: entrada numèrica simple (123)
- Moneda – Diners amb símbols (123.00 $, 123.00 €, 123.00 £)
- Percentatge – Símbol % d'afegit automàticament (85%)
- Decimal – decimals fixos (123.45)
Símbols de moneda personalitzats
Admet qualsevol moneda: $, €, £, ¥, ₹ i més, perfecte per a formularis internacionals.
Precisió decimal
Controla els decimals de 0 a 4 dígits per a càlculs exactes.
Mode de control lliscant interactiu
Selecció visual de números
Transforma les entrades numèriques en bonics controls lliscants. Els usuaris poden lliscar per seleccionar valors: perfectes per a classificacions, intervals i preferències.
Aspecte personalitzable
- Trieu el color del control lliscant que coincideixi amb la vostra marca
- Mostra/amaga la visualització del valor actual
- Animacions i transicions suaus
Ideal per a:
- Puntuacions de satisfacció (1-10)
- Rangs de pressupost (0 $ - 5000 $)
- Selectors d'edat
- Nivells de prioritat
- Qualsevol selecció de rang
🔀 Lògica condicional
Visibilitat intel·ligent al camp
Mostra o amaga aquest camp numèric en funció dels valors d'altres camps. Crea formularis dinàmics que s'adaptin a l'entrada de l'usuari.
Regles de lògica avançada:
- Lògica I: s'han de complir totes les condicions
- Lògica O: qualsevol condició pot desencadenar l'acció
- 8 operadors: Igual a, No igual a, Més gran que, Més petit que, Conté, És buit i més
Casos d'ús:
- Mostra "Nombre de convidats" només quan la casella de selecció "Voleu portar convidats?" està marcada
- Mostra "Interval de pressupost" quan el tipus de servei és igual a "Premium"
- Amaga el "codi de descompte" quan el total de la comanda sigui inferior a 50 $
- Mostra les opcions amb restriccions d'edat quan l'edat és superior a 1 any
🎨 Personalització completa
- Classes CSS personalitzades
- Mode de camp ocult
- Entrades optimitzades per a mòbils
- Suport d’accessibilitat
- Integració amb totes les funcions del formulari
- Mida del pas, valor inicial
- Valor permès més baix/més alt
- Camp ocult, valor ocult
⚙️ Configuració intel·ligent
Valors predeterminats
Preompliu els camps amb números inicials per guiar els usuaris o accelerar la finalització.
Text de marcador de posició
Mostra consells útils com ara "Introdueix la quantitat" o "La teva edat" abans que els usuaris escriguin.
Text d'ajuda
Afegiu descripcions per aclarir quins números cal introduir.
Configuració senzilla en 3 passos
Prepara el teu camp desplegable en qüestió de minuts
Afegir el camp numèric
Arrossegueu i deixeu anar el camp Número de la secció Camps bàsics al formulari.
Estableix les regles de validació
Configureu els valors mínims/màxims, la mida del pas i el valor inicial per controlar els números que els usuaris poden introduir.
Trieu el format i l'estil
Seleccioneu el format pla, de moneda, de percentatge o decimal. Opcionalment, activeu el mode de control lliscant per a la selecció visual.
🎉 Això és tot! El camp numèric està a punt amb validació i format intel·ligents.
Aplicacions del món real
Comerç electrònic i comandes
- Selectors de quantitat de producte
- Filtres de rang de preus
- Entrades de percentatge de descompte
- Nombre d'elements i totals
Enquestes i valoracions
- Puntuacions de satisfacció (1-10)
- Valoracions amb estrelles
- Classificacions de prioritat
- Escales de probabilitat
Fitness i salut
- Seguiment del pes
- Mesures d'alçada
- Repeticions d'exercicis
- Calculadores d'IMC
Reserves i reserves
- Nombre de convidats/assistents
- Quantitat d'habitació
- Durada en hores/dies
- Mida del partit
Formularis de sol·licitud
- Verificació d’edat
- Anys d'Experiència
- Expectatives salarials
- Rangs de pressupost
Negocis i finances
- Entrades d'ingressos
- Imports d'inversió
- Percentatges de retorn de la inversió
- Tarifes de comissions
Opcions de camp completes
Configuració bàsica
- Etiqueta de camp – El títol que es mostra a sobre del camp numèric
- Descripció/Text d'ajuda – Guia addicional per als usuaris
- Camp necessari – Fer que l'entrada de números sigui obligatòria
- Text de marcador de posició – Text de pista abans que els usuaris introdueixin un número
Configuració de validació
- Valor més baix permès (mínim) – Nombre més petit acceptable
- Valor màxim permès (màx.) – Nombre màxim acceptable
- Mida del pas – Increment del valor (1, 0.5, 0.01, etc.)
- Valor inicial – Número predeterminat preomplert
Format dels números
- Format de visualització
- Número pla
- Moneda (amb símbol)
- Percentatge (%)
- Decimal (xifres fixes)
Símbol de la moneda – $, €, £, ¥, ₹ (quan el format és Moneda)
Llocs decimals – 0, 1, 2, 3 o 4 dígits (quan el format és Decimal)
Opcions del control lliscant
- Mostra com a control lliscant – Activa el mode de control lliscant interactiu
- Color del control lliscant – Selector de colors personalitzat per a la marca
- Mostra el número al costat del control lliscant – Mostra el valor actual
Lògica condicional
- Activa la lògica condicional – Mostra/amaga segons les condicions
Tipus lògic- Cal complir totes les condicions (I)
- Es pot complir qualsevol condició (O)
- Regles de condició
- Mostra / Amaga – Accions a emprendre
- Camp – Quin camp cal comprovar
- Operador – Igual a, No és igual a, Conté, Més gran que, Menor que, És buit, No és buit
- Valor – Valor de comparació
- Condicions múltiples – Afegir regles il·limitades
Opcions avançades
- Mode de camp ocult – Utilitza com a camp ocult amb un valor preestablert
- Classes CSS personalitzades – Aplicar un estil personalitzat
- Atributs d'accessibilitat – Etiquetes i descripcions ARIA
Per què escollir el nostre camp numèric?
✅ precís – La validació exacta de mínims/màxims evita les entrades no vàlides
✅ Flexible – Múltiples formats per a qualsevol cas d'ús
✅ Visual – El mode lliscant crea interaccions atractives
✅ Intel · ligent – La lògica condicional crea formes dinàmiques
✅ Fàcil d'usar – Missatges de validació clars que guien els usuaris
✅ Professional – Format de moneda i percentatge integrat
✅ Optimitzat per a mòbils – Teclats de números perfectes en dispositius mòbils
✅ Totalment integrat – Funciona perfectament amb totes les funcions del formulari
Preguntes freqüents
P: Quina diferència hi ha entre mínim/màxim i validació?
A: La configuració de mínims/màxims proporciona una validació instantània a nivell de navegador. Els usuaris no poden enviar números no vàlids, cosa que fa que els formularis estiguin lliures d'errors i siguin fàcils d'utilitzar.
P: Puc fer servir nombres decimals?
R: Sí! Definiu el valor del Pas per controlar els decimals. Feu servir 0.01 per a la moneda (preus), 0.1 per a un decimal o qualsevol pas personalitzat.
P: Com funciona el control lliscant al mòbil?
A: Els controls lliscants estan optimitzats per al tacte i funcionen sense problemes en dispositius mòbils.
P: Puc recopilar nombres negatius?
A: Absolutament! Establiu un valor mínim negatiu (per exemple, Mín: -100, Màx: 100) per permetre nombres negatius.
P: Quins símbols de moneda són compatibles?
A: Qualsevol símbol! Introduïu $, €, £, ¥, ₹ o qualsevol símbol personalitzat de fins a 3 caràcters.
P: Puc utilitzar la lògica condicional basada en comparacions de nombres?
R: Sí! Feu servir operadors com ara "Més gran que", "Menor que" i "Igual a" per crear lògica basada en valors numèrics.
P: Com puc crear un camp de percentatge?
A: Seleccioneu “Percentatge (%)” com a Format de visualització. El símbol % apareix automàticament i els usuaris introdueixen valors del 0 al 100.
P: Puc canviar el color del control lliscant?
R: Sí! Quan el mode lliscant està activat, podeu triar qualsevol color amb el selector de colors.
P: Què passa si els usuaris introdueixen números fora de l'interval?
A: La validació del navegador atura l'enviament i mostra un missatge d'error com ara "El valor ha de ser entre 1 i 100".
P: Puc utilitzar el camp numèric per a càlculs?
R: Sí! Els valors del camp numèric funcionen en comparacions condicionals i en càlculs en el processament de formularis.
P: Quina precisió poden tenir els nombres decimals?
A: Podeu definir decimals de 0 a 4 dígits i els valors dels passos poden ser tan precisos com calgui (per exemple, 0.001).
