constrained fields (maxlength and regex pattern support)

Pages/Fundvelo/CaritasServiceFundVeloAlternatePickupContactPage.razor

@@ -35,24 +35,24 @@
         <div class="row no-gutters w-100">
             <div class="col-6" style="padding-right:0.5em">
                 <MatStringField Class="w-100" Label="@I18n["Firstname"]" Outlined="true" type="text" @bind-Value="pucFirstname" Required="true"
-                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                 OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="50"></MatStringField>
             </div>
             <div class="col-6" style="padding-left:0.5em">
                 <MatStringField Class="w-100" Label="@I18n["Lastname"]" Outlined="true" type="text" @bind-Value="pucLastname" Required="true"
-                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                 OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="50"></MatStringField>
             </div>
         </div>
         <div class="row no-gutters align-items-center w-100">
             <div class="col-12">
                 <MatStringField Class="w-100" Label="@I18n["Address"]" Outlined="true" type="text" @bind-Value="pucAddress" Required="true"
-                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                 OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="50"></MatStringField>
             </div>
         </div>
         <div class="row no-gutters align-items-center w-100">
             <div class="col-12">
                 <div class="outlined">
                     <MatAutocompleteList TItem="ZipCity" FullWidth="true" Label="@getZipCityLbl()" Required="true" Items="@ZipCities" OnTextChanged="setZipCityValue" @bind-Value="SelectedZipCity" CustomStringSelector="@(i => i?.Zip_City)"
-                                         ShowClearButton="true" NumberOfElementsInPopup="6" @onkeydown="InputCursorHandler.OnKeyDownHandlerAsync">
+                     ShowClearButton="true" NumberOfElementsInPopup="6" @onkeydown="InputCursorHandler.OnKeyDownHandlerAsync">
                         <ItemTemplate>
                             <div>
                                 <span>@context?.Zip_City</span>
@@ -65,19 +65,19 @@
         <div class="row no-gutters align-items-center w-100">
             <div class="col-12">
                 <MatStringField Class="w-100" Label="@I18n["Mobile"]" Outlined="true" type="text" @bind-Value="pucMobile"
-                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                 OnKeyDown="@InputCursorHandler.OnConstrainedFieldKeyDownHandlerAsync" maxlength="20" pattern="^([0-9]*)$"></MatStringField>
             </div>
         </div>
         <div class="row no-gutters align-items-center w-100">
             <div class="col-12">
                 <MatStringField Class="w-100" Label="@I18n["Phone"]" Outlined="true" type="text" @bind-Value="pucPhone"
-                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                 OnKeyDown="@InputCursorHandler.OnConstrainedFieldKeyDownHandlerAsync" maxlength="20" pattern="^([0-9]*)$"></MatStringField>
             </div>
         </div>
         <div class="row no-gutters align-items-center w-100">
             <div class="col-12">
                 <MatStringField Class="w-100" Label="@I18n["Mail"]" Outlined="true" type="text" @bind-Value="pucEmail"
-                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                 OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="50"></MatStringField>
             </div>
         </div>
     </div>

Pages/Fundvelo/CaritasServiceFundVeloFoundKeyDataPage.razor

@@ -109,7 +109,7 @@
                     <div class="mat-layout-grid-inner">
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
                             <MatStringField Class="w-100 form-check-label" Label="@getAddressLbl()" Outlined="true" Required="true" Type="text" @bind-Value="@bicycleGeoPosition.Address"
-                                            OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="50"></MatStringField>
                         </div>
 
                         @if (OnlineStatusProvider.Online) {
@@ -184,13 +184,13 @@
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
                             <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
                                 <MatStringField Class="w-100 form-check-label" Label="@I18n["FrameNumber"]" Outlined="true" type="text" @bind-Value="frameNumber"
-                                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                                 OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="20"></MatStringField>
                             </div>
                         </div>
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">
                             <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
                                 <MatStringField Class="w-100 form-check-label" Label="@I18n["Remark"]" Outlined="true" type="text" @bind-Value="remark"
-                                                OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                                 OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="1000"></MatStringField>
                             </div>
                         </div>
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-4-desktop">

Pages/Fundvelo/CaritasServiceFundVeloMissingKeyDataPage.razor

@@ -108,7 +108,7 @@
                         </div>
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
                             <MatStringField Class="w-100 form-check-label" Label="@I18n["FrameNumber"]" Outlined="true" type="text" @bind-Value="frameNumber"
-                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="20"></MatStringField>
                         </div>
                     </div>
                 </div>
@@ -116,13 +116,12 @@
                     <div class="mat-layout-grid-inner">
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
                             <MatNumericUpDownField Class="w-100" Label="@I18n["Age"]" Outlined="true" @bind-Value="@age"
-                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatNumericUpDownField>
+                             OnKeyDown="@InputCursorHandler.OnConstrainedFieldKeyDownHandlerAsync" pattern="^([0-9]*)$"></MatNumericUpDownField>
                         </div>
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
                             <MatTextField Class="w-100 form-check-label" Label="@I18n["Price"]" Format="0.00" Outlined="true" @bind-Value="@price"
-                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatTextField>
+                             OnKeyDown="@InputCursorHandler.OnConstrainedFieldKeyDownHandlerAsync" pattern="^([0-9]+,?[0-9]*|,[0-9]+)$"></MatTextField>
                         </div>
-
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-8-tablet mat-layout-grid-cell-span-12-desktop">
                             <MatSelectValue FullWidth="true" Outlined="true" Label="@I18n["SearchService"]" @bind-Value="selectedSearchService" Items="@SearchServices" ValueSelector="@(i=>i)"
                              @onkeydown="InputCursorHandler.OnKeyDownHandlerAsync">
@@ -135,11 +134,11 @@
                         </div>
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
                             <MatStringField Class="w-100 form-check-label" Label="@I18n["SearchServiceNbr"]" Outlined="true" type="text" @bind-Value="searchServiceNbr"
-                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="20"></MatStringField>
                         </div>
                         <div class="mat-layout-grid-cell mat-layout-grid-cell-span-4-phone mat-layout-grid-cell-span-4-tablet mat-layout-grid-cell-span-12-desktop">
                             <MatStringField Class="w-100 form-check-label" Label="@I18n["Remark"]" Outlined="true" type="text" @bind-Value="remark"
-                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync"></MatStringField>
+                             OnKeyDown="@InputCursorHandler.OnKeyDownHandlerAsync" maxlength="1000"></MatStringField>
                         </div>
                     </div>
                 </div>