[{"data":1,"prerenderedAt":812},["Reactive",2],{"content-query-v3VgFoec3T":3},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"_empty":6,"title":8,"description":9,"body":10,"_type":807,"_id":808,"_source":809,"_file":810,"_extension":811},"/docs/forms/validation/schema","validation",false,"","Form Validation - Schema - Inkline","The form validation schema defines state of the form fields, groups, validation rules, and how they work together.",{"type":11,"children":12,"toc":804},"root",[13,20,27,48,257,268,279,359,366,377,799],{"type":14,"tag":15,"props":16,"children":19},"element","content-heading",{"subtitle":17,"title":18},"Form Validation","Schema",[],{"type":14,"tag":21,"props":22,"children":24},"h2",{"id":23},"the-form-validation-schema-defines-state-of-the-form-fields-groups-validation-rules-and-how-they-work-together",[25],{"type":26,"value":9},"text",{"type":14,"tag":28,"props":29,"children":30},"p",{},[31,33,39,41,46],{"type":26,"value":32},"To initialize form validation, you first provide a raw, unresolved schema to the ",{"type":14,"tag":34,"props":35,"children":36},"code-inline",{},[37],{"type":26,"value":38},"useForm",{"type":26,"value":40}," composable function. The composable enhances the user-provided schema with validation state fields, and then returns the resolved ",{"type":14,"tag":34,"props":42,"children":43},{},[44],{"type":26,"value":45},"schema",{"type":26,"value":47}," object ref.",{"type":14,"tag":49,"props":50,"children":55},"code",{"className":51,"code":53,"language":54,"meta":7},[52],"language-ts","const { schema } = useForm\u003C{ field: string; }>({\n    field: {\n        value: 'example',\n        validators: [\n            { \n                name: 'required', \n                message: 'This field is required' \n            }\n        ]\n    }\n});\n","ts",[56],{"type":14,"tag":57,"props":58,"children":59},"pre",{},[60],{"type":14,"tag":49,"props":61,"children":62},{"__ignoreMap":7},[63,136,145,165,174,183,202,221,230,239,248],{"type":14,"tag":64,"props":65,"children":68},"span",{"class":66,"line":67},"line",1,[69,75,81,86,91,96,101,106,111,117,122,126,131],{"type":14,"tag":64,"props":70,"children":72},{"class":71},"ct-149352",[73],{"type":26,"value":74},"const",{"type":14,"tag":64,"props":76,"children":78},{"class":77},"ct-553616",[79],{"type":26,"value":80}," { ",{"type":14,"tag":64,"props":82,"children":84},{"class":83},"ct-617022",[85],{"type":26,"value":45},{"type":14,"tag":64,"props":87,"children":88},{"class":77},[89],{"type":26,"value":90}," } ",{"type":14,"tag":64,"props":92,"children":93},{"class":71},[94],{"type":26,"value":95},"=",{"type":14,"tag":64,"props":97,"children":98},{"class":77},[99],{"type":26,"value":100}," ",{"type":14,"tag":64,"props":102,"children":104},{"class":103},"ct-762058",[105],{"type":26,"value":38},{"type":14,"tag":64,"props":107,"children":108},{"class":77},[109],{"type":26,"value":110},"\u003C{ ",{"type":14,"tag":64,"props":112,"children":114},{"class":113},"ct-157101",[115],{"type":26,"value":116},"field",{"type":14,"tag":64,"props":118,"children":119},{"class":71},[120],{"type":26,"value":121},":",{"type":14,"tag":64,"props":123,"children":124},{"class":77},[125],{"type":26,"value":100},{"type":14,"tag":64,"props":127,"children":128},{"class":83},[129],{"type":26,"value":130},"string",{"type":14,"tag":64,"props":132,"children":133},{"class":77},[134],{"type":26,"value":135},"; }>({\n",{"type":14,"tag":64,"props":137,"children":139},{"class":66,"line":138},2,[140],{"type":14,"tag":64,"props":141,"children":142},{"class":77},[143],{"type":26,"value":144},"    field: {\n",{"type":14,"tag":64,"props":146,"children":148},{"class":66,"line":147},3,[149,154,160],{"type":14,"tag":64,"props":150,"children":151},{"class":77},[152],{"type":26,"value":153},"        value: ",{"type":14,"tag":64,"props":155,"children":157},{"class":156},"ct-952708",[158],{"type":26,"value":159},"'example'",{"type":14,"tag":64,"props":161,"children":162},{"class":77},[163],{"type":26,"value":164},",\n",{"type":14,"tag":64,"props":166,"children":168},{"class":66,"line":167},4,[169],{"type":14,"tag":64,"props":170,"children":171},{"class":77},[172],{"type":26,"value":173},"        validators: [\n",{"type":14,"tag":64,"props":175,"children":177},{"class":66,"line":176},5,[178],{"type":14,"tag":64,"props":179,"children":180},{"class":77},[181],{"type":26,"value":182},"            { \n",{"type":14,"tag":64,"props":184,"children":186},{"class":66,"line":185},6,[187,192,197],{"type":14,"tag":64,"props":188,"children":189},{"class":77},[190],{"type":26,"value":191},"                name: ",{"type":14,"tag":64,"props":193,"children":194},{"class":156},[195],{"type":26,"value":196},"'required'",{"type":14,"tag":64,"props":198,"children":199},{"class":77},[200],{"type":26,"value":201},", \n",{"type":14,"tag":64,"props":203,"children":205},{"class":66,"line":204},7,[206,211,216],{"type":14,"tag":64,"props":207,"children":208},{"class":77},[209],{"type":26,"value":210},"                message: ",{"type":14,"tag":64,"props":212,"children":213},{"class":156},[214],{"type":26,"value":215},"'This field is required'",{"type":14,"tag":64,"props":217,"children":218},{"class":77},[219],{"type":26,"value":220}," \n",{"type":14,"tag":64,"props":222,"children":224},{"class":66,"line":223},8,[225],{"type":14,"tag":64,"props":226,"children":227},{"class":77},[228],{"type":26,"value":229},"            }\n",{"type":14,"tag":64,"props":231,"children":233},{"class":66,"line":232},9,[234],{"type":14,"tag":64,"props":235,"children":236},{"class":77},[237],{"type":26,"value":238},"        ]\n",{"type":14,"tag":64,"props":240,"children":242},{"class":66,"line":241},10,[243],{"type":14,"tag":64,"props":244,"children":245},{"class":77},[246],{"type":26,"value":247},"    }\n",{"type":14,"tag":64,"props":249,"children":251},{"class":66,"line":250},11,[252],{"type":14,"tag":64,"props":253,"children":254},{"class":77},[255],{"type":26,"value":256},"});",{"type":14,"tag":28,"props":258,"children":259},{},[260,262,266],{"type":26,"value":261},"After initialization, the resolved ",{"type":14,"tag":34,"props":263,"children":264},{},[265],{"type":26,"value":45},{"type":26,"value":267}," object is a reactive object ref, and will update the field value, errors, and validation state for the whole schema when an input value changes.",{"type":14,"tag":28,"props":269,"children":270},{},[271,273,277],{"type":26,"value":272},"The ",{"type":14,"tag":34,"props":274,"children":275},{},[276],{"type":26,"value":45},{"type":26,"value":278}," object provides you with all the information you need about the current form state:",{"type":14,"tag":280,"props":281,"children":282},"ul",{},[283,295,306,348],{"type":14,"tag":284,"props":285,"children":286},"li",{},[287,288,293],{"type":26,"value":272},{"type":14,"tag":34,"props":289,"children":290},{},[291],{"type":26,"value":292},"value",{"type":26,"value":294}," field represents the current value of the field",{"type":14,"tag":284,"props":296,"children":297},{},[298,299,304],{"type":26,"value":272},{"type":14,"tag":34,"props":300,"children":301},{},[302],{"type":26,"value":303},"validators",{"type":26,"value":305}," field represents an array of validators to be used to validate the field input",{"type":14,"tag":284,"props":307,"children":308},{},[309,310,315,317,322,323,328,329,334,335,340,341,346],{"type":26,"value":272},{"type":14,"tag":34,"props":311,"children":312},{},[313],{"type":26,"value":314},"valid",{"type":26,"value":316},", ",{"type":14,"tag":34,"props":318,"children":319},{},[320],{"type":26,"value":321},"invalid",{"type":26,"value":316},{"type":14,"tag":34,"props":324,"children":325},{},[326],{"type":26,"value":327},"touched",{"type":26,"value":316},{"type":14,"tag":34,"props":330,"children":331},{},[332],{"type":26,"value":333},"untouched",{"type":26,"value":316},{"type":14,"tag":34,"props":336,"children":337},{},[338],{"type":26,"value":339},"dirty",{"type":26,"value":316},{"type":14,"tag":34,"props":342,"children":343},{},[344],{"type":26,"value":345},"pristine",{"type":26,"value":347}," fields represent the current validation state of the field, group, or form root",{"type":14,"tag":284,"props":349,"children":350},{},[351,352,357],{"type":26,"value":272},{"type":14,"tag":34,"props":353,"children":354},{},[355],{"type":26,"value":356},"errors",{"type":26,"value":358}," field represents an array of errors that are currently affecting the field",{"type":14,"tag":360,"props":361,"children":363},"h5",{"id":362},"resolved-schema",[364],{"type":26,"value":365},"Resolved Schema",{"type":14,"tag":28,"props":367,"children":368},{},[369,371,375],{"type":26,"value":370},"The resolved ",{"type":14,"tag":34,"props":372,"children":373},{},[374],{"type":26,"value":45},{"type":26,"value":376}," object looks as follows:",{"type":14,"tag":49,"props":378,"children":381},{"className":379,"code":380,"language":54,"meta":7},[52],"{\n    field: {\n        value: 'example',\n        valid: true,\n        invalid: false,\n        touched: false,\n        untouched: true,\n        dirty: false,\n        pristine: true,\n        errors: [],\n        validators: [ ... ]\n    },\n    valid: true,\n    invalid: false,\n    touched: false,\n    untouched: true,\n    dirty: false,\n    pristine: true,\n    errors: []\n}\n",[382],{"type":14,"tag":57,"props":383,"children":384},{},[385],{"type":14,"tag":49,"props":386,"children":387},{"__ignoreMap":7},[388,396,413,438,462,486,509,532,555,578,594,620,629,653,677,701,725,749,773,790],{"type":14,"tag":64,"props":389,"children":390},{"class":66,"line":67},[391],{"type":14,"tag":64,"props":392,"children":393},{"class":77},[394],{"type":26,"value":395},"{\n",{"type":14,"tag":64,"props":397,"children":398},{"class":66,"line":138},[399,404,408],{"type":14,"tag":64,"props":400,"children":401},{"class":77},[402],{"type":26,"value":403},"    ",{"type":14,"tag":64,"props":405,"children":406},{"class":103},[407],{"type":26,"value":116},{"type":14,"tag":64,"props":409,"children":410},{"class":77},[411],{"type":26,"value":412},": {\n",{"type":14,"tag":64,"props":414,"children":415},{"class":66,"line":147},[416,421,425,430,434],{"type":14,"tag":64,"props":417,"children":418},{"class":77},[419],{"type":26,"value":420},"        ",{"type":14,"tag":64,"props":422,"children":423},{"class":103},[424],{"type":26,"value":292},{"type":14,"tag":64,"props":426,"children":427},{"class":77},[428],{"type":26,"value":429},": ",{"type":14,"tag":64,"props":431,"children":432},{"class":156},[433],{"type":26,"value":159},{"type":14,"tag":64,"props":435,"children":436},{"class":77},[437],{"type":26,"value":164},{"type":14,"tag":64,"props":439,"children":440},{"class":66,"line":167},[441,445,449,453,458],{"type":14,"tag":64,"props":442,"children":443},{"class":77},[444],{"type":26,"value":420},{"type":14,"tag":64,"props":446,"children":447},{"class":103},[448],{"type":26,"value":314},{"type":14,"tag":64,"props":450,"children":451},{"class":77},[452],{"type":26,"value":429},{"type":14,"tag":64,"props":454,"children":455},{"class":83},[456],{"type":26,"value":457},"true",{"type":14,"tag":64,"props":459,"children":460},{"class":77},[461],{"type":26,"value":164},{"type":14,"tag":64,"props":463,"children":464},{"class":66,"line":176},[465,469,473,477,482],{"type":14,"tag":64,"props":466,"children":467},{"class":77},[468],{"type":26,"value":420},{"type":14,"tag":64,"props":470,"children":471},{"class":103},[472],{"type":26,"value":321},{"type":14,"tag":64,"props":474,"children":475},{"class":77},[476],{"type":26,"value":429},{"type":14,"tag":64,"props":478,"children":479},{"class":83},[480],{"type":26,"value":481},"false",{"type":14,"tag":64,"props":483,"children":484},{"class":77},[485],{"type":26,"value":164},{"type":14,"tag":64,"props":487,"children":488},{"class":66,"line":185},[489,493,497,501,505],{"type":14,"tag":64,"props":490,"children":491},{"class":77},[492],{"type":26,"value":420},{"type":14,"tag":64,"props":494,"children":495},{"class":103},[496],{"type":26,"value":327},{"type":14,"tag":64,"props":498,"children":499},{"class":77},[500],{"type":26,"value":429},{"type":14,"tag":64,"props":502,"children":503},{"class":83},[504],{"type":26,"value":481},{"type":14,"tag":64,"props":506,"children":507},{"class":77},[508],{"type":26,"value":164},{"type":14,"tag":64,"props":510,"children":511},{"class":66,"line":204},[512,516,520,524,528],{"type":14,"tag":64,"props":513,"children":514},{"class":77},[515],{"type":26,"value":420},{"type":14,"tag":64,"props":517,"children":518},{"class":103},[519],{"type":26,"value":333},{"type":14,"tag":64,"props":521,"children":522},{"class":77},[523],{"type":26,"value":429},{"type":14,"tag":64,"props":525,"children":526},{"class":83},[527],{"type":26,"value":457},{"type":14,"tag":64,"props":529,"children":530},{"class":77},[531],{"type":26,"value":164},{"type":14,"tag":64,"props":533,"children":534},{"class":66,"line":223},[535,539,543,547,551],{"type":14,"tag":64,"props":536,"children":537},{"class":77},[538],{"type":26,"value":420},{"type":14,"tag":64,"props":540,"children":541},{"class":103},[542],{"type":26,"value":339},{"type":14,"tag":64,"props":544,"children":545},{"class":77},[546],{"type":26,"value":429},{"type":14,"tag":64,"props":548,"children":549},{"class":83},[550],{"type":26,"value":481},{"type":14,"tag":64,"props":552,"children":553},{"class":77},[554],{"type":26,"value":164},{"type":14,"tag":64,"props":556,"children":557},{"class":66,"line":232},[558,562,566,570,574],{"type":14,"tag":64,"props":559,"children":560},{"class":77},[561],{"type":26,"value":420},{"type":14,"tag":64,"props":563,"children":564},{"class":103},[565],{"type":26,"value":345},{"type":14,"tag":64,"props":567,"children":568},{"class":77},[569],{"type":26,"value":429},{"type":14,"tag":64,"props":571,"children":572},{"class":83},[573],{"type":26,"value":457},{"type":14,"tag":64,"props":575,"children":576},{"class":77},[577],{"type":26,"value":164},{"type":14,"tag":64,"props":579,"children":580},{"class":66,"line":241},[581,585,589],{"type":14,"tag":64,"props":582,"children":583},{"class":77},[584],{"type":26,"value":420},{"type":14,"tag":64,"props":586,"children":587},{"class":103},[588],{"type":26,"value":356},{"type":14,"tag":64,"props":590,"children":591},{"class":77},[592],{"type":26,"value":593},": [],\n",{"type":14,"tag":64,"props":595,"children":596},{"class":66,"line":250},[597,601,605,610,615],{"type":14,"tag":64,"props":598,"children":599},{"class":77},[600],{"type":26,"value":420},{"type":14,"tag":64,"props":602,"children":603},{"class":103},[604],{"type":26,"value":303},{"type":14,"tag":64,"props":606,"children":607},{"class":77},[608],{"type":26,"value":609},": [ ",{"type":14,"tag":64,"props":611,"children":612},{"class":71},[613],{"type":26,"value":614},"...",{"type":14,"tag":64,"props":616,"children":617},{"class":77},[618],{"type":26,"value":619}," ]\n",{"type":14,"tag":64,"props":621,"children":623},{"class":66,"line":622},12,[624],{"type":14,"tag":64,"props":625,"children":626},{"class":77},[627],{"type":26,"value":628},"    },\n",{"type":14,"tag":64,"props":630,"children":632},{"class":66,"line":631},13,[633,637,641,645,649],{"type":14,"tag":64,"props":634,"children":635},{"class":77},[636],{"type":26,"value":403},{"type":14,"tag":64,"props":638,"children":639},{"class":103},[640],{"type":26,"value":314},{"type":14,"tag":64,"props":642,"children":643},{"class":77},[644],{"type":26,"value":429},{"type":14,"tag":64,"props":646,"children":647},{"class":83},[648],{"type":26,"value":457},{"type":14,"tag":64,"props":650,"children":651},{"class":77},[652],{"type":26,"value":164},{"type":14,"tag":64,"props":654,"children":656},{"class":66,"line":655},14,[657,661,665,669,673],{"type":14,"tag":64,"props":658,"children":659},{"class":77},[660],{"type":26,"value":403},{"type":14,"tag":64,"props":662,"children":663},{"class":103},[664],{"type":26,"value":321},{"type":14,"tag":64,"props":666,"children":667},{"class":77},[668],{"type":26,"value":429},{"type":14,"tag":64,"props":670,"children":671},{"class":83},[672],{"type":26,"value":481},{"type":14,"tag":64,"props":674,"children":675},{"class":77},[676],{"type":26,"value":164},{"type":14,"tag":64,"props":678,"children":680},{"class":66,"line":679},15,[681,685,689,693,697],{"type":14,"tag":64,"props":682,"children":683},{"class":77},[684],{"type":26,"value":403},{"type":14,"tag":64,"props":686,"children":687},{"class":103},[688],{"type":26,"value":327},{"type":14,"tag":64,"props":690,"children":691},{"class":77},[692],{"type":26,"value":429},{"type":14,"tag":64,"props":694,"children":695},{"class":83},[696],{"type":26,"value":481},{"type":14,"tag":64,"props":698,"children":699},{"class":77},[700],{"type":26,"value":164},{"type":14,"tag":64,"props":702,"children":704},{"class":66,"line":703},16,[705,709,713,717,721],{"type":14,"tag":64,"props":706,"children":707},{"class":77},[708],{"type":26,"value":403},{"type":14,"tag":64,"props":710,"children":711},{"class":103},[712],{"type":26,"value":333},{"type":14,"tag":64,"props":714,"children":715},{"class":77},[716],{"type":26,"value":429},{"type":14,"tag":64,"props":718,"children":719},{"class":83},[720],{"type":26,"value":457},{"type":14,"tag":64,"props":722,"children":723},{"class":77},[724],{"type":26,"value":164},{"type":14,"tag":64,"props":726,"children":728},{"class":66,"line":727},17,[729,733,737,741,745],{"type":14,"tag":64,"props":730,"children":731},{"class":77},[732],{"type":26,"value":403},{"type":14,"tag":64,"props":734,"children":735},{"class":103},[736],{"type":26,"value":339},{"type":14,"tag":64,"props":738,"children":739},{"class":77},[740],{"type":26,"value":429},{"type":14,"tag":64,"props":742,"children":743},{"class":83},[744],{"type":26,"value":481},{"type":14,"tag":64,"props":746,"children":747},{"class":77},[748],{"type":26,"value":164},{"type":14,"tag":64,"props":750,"children":752},{"class":66,"line":751},18,[753,757,761,765,769],{"type":14,"tag":64,"props":754,"children":755},{"class":77},[756],{"type":26,"value":403},{"type":14,"tag":64,"props":758,"children":759},{"class":103},[760],{"type":26,"value":345},{"type":14,"tag":64,"props":762,"children":763},{"class":77},[764],{"type":26,"value":429},{"type":14,"tag":64,"props":766,"children":767},{"class":83},[768],{"type":26,"value":457},{"type":14,"tag":64,"props":770,"children":771},{"class":77},[772],{"type":26,"value":164},{"type":14,"tag":64,"props":774,"children":776},{"class":66,"line":775},19,[777,781,785],{"type":14,"tag":64,"props":778,"children":779},{"class":77},[780],{"type":26,"value":403},{"type":14,"tag":64,"props":782,"children":783},{"class":103},[784],{"type":26,"value":356},{"type":14,"tag":64,"props":786,"children":787},{"class":77},[788],{"type":26,"value":789},": []\n",{"type":14,"tag":64,"props":791,"children":793},{"class":66,"line":792},20,[794],{"type":14,"tag":64,"props":795,"children":796},{"class":77},[797],{"type":26,"value":798},"}",{"type":14,"tag":800,"children":801},"style",[802],{"type":26,"value":803},".ct-149352{color:#D73A49;}\n.dark-theme .ct-149352{color:#F97583;}\n.ct-553616{color:#24292E;}\n.dark-theme .ct-553616{color:#E1E4E8;}\n.ct-617022{color:#005CC5;}\n.dark-theme .ct-617022{color:#79B8FF;}\n.ct-762058{color:#6F42C1;}\n.dark-theme .ct-762058{color:#B392F0;}\n.ct-157101{color:#E36209;}\n.dark-theme .ct-157101{color:#FFAB70;}\n.ct-952708{color:#032F62;}\n.dark-theme .ct-952708{color:#9ECBFF;}",{"title":7,"searchDepth":138,"depth":138,"links":805},[806],{"id":23,"depth":138,"text":9},"markdown","content:docs:forms:validation:schema:index.md","content","docs/forms/validation/schema/index.md","md",1794582260789]