Merge pull request #1594 from gjwalk/dev

moduleDefinitions validation

Oqtane.Client/Modules/Admin/ModuleDefinitions/Create.razor

@@ -10,29 +10,30 @@
 
 @if (_templates != null)
 {
+    <form @ref="form" class="@(validated ? "was-validated" : "needs-validation")" novalidate>
         <div class="container">
             <div class="row mb-1 align-items-center">
                 <Label Class="col-sm-3" For="owner" HelpText="Enter the name of the organization who is developing this module. It should not contain spaces or punctuation." ResourceKey="OwnerName">Owner Name: </Label>
                 <div class="col-sm-9">
-                <input id="owner" class="form-control" @bind="@_owner" />
+                    <input id="owner" class="form-control" @bind="@_owner" required />
                 </div>
             </div>
             <div class="row mb-1 align-items-center">
                 <Label Class="col-sm-3" For="module" HelpText="Enter a name for this module. It should not contain spaces or punctuation." ResourceKey="ModuleName">Module Name: </Label>
                 <div class="col-sm-9">
-                <input id="module" class="form-control" @bind="@_module" />
+                    <input id="module" class="form-control" @bind="@_module" required />
                 </div>
             </div>
             <div class="row mb-1 align-items-center">
                 <Label Class="col-sm-3" For="description" HelpText="Enter a short description for the module" ResourceKey="Description">Description: </Label>
                 <div class="col-sm-9">
-                <textarea id="description" class="form-control" @bind="@_description" rows="3"></textarea>
+                    <textarea id="description" class="form-control" @bind="@_description" rows="3" maxlength="2000" required></textarea>
                 </div>
             </div>
             <div class="row mb-1 align-items-center">
                 <Label Class="col-sm-3" For="template" HelpText="Select a module template. Templates are located in the wwwroot/Modules/Templates folder on the server." ResourceKey="Template">Template: </Label>
                 <div class="col-sm-9">
-                <select id="template" class="form-select" @onchange="(e => TemplateChanged(e))">
+                    <select id="template" class="form-select" @onchange="(e => TemplateChanged(e))" required>
                         <option value="-">&lt;@Localizer["Template.Select"]&gt;</option>
                         @foreach (Template template in _templates)
                         {
@@ -44,7 +45,7 @@
             <div class="row mb-1 align-items-center">
                 <Label Class="col-sm-3" For="reference" HelpText="Select a framework reference version" ResourceKey="FrameworkReference">Framework Reference: </Label>
                 <div class="col-sm-9">
-                <select id="reference" class="form-select" @bind="@_reference">
+                    <select id="reference" class="form-select" @bind="@_reference" required>
                         @foreach (string version in _versions)
                         {
                             if (Version.Parse(version).CompareTo(Version.Parse(_minversion)) >= 0)
@@ -68,9 +69,12 @@
         </div>
         <button type="button" class="btn btn-success" @onclick="CreateModule">@Localizer["CreateModule"]</button>
         <NavLink class="btn btn-secondary" href="@NavigateUrl()">@SharedLocalizer["Cancel"]</NavLink>
+    </form>
 }
 
 @code {
+    private ElementReference form;
+    private bool validated = false;
     private string _owner = string.Empty;
     private string _module = string.Empty;
     private string _description = string.Empty;
@@ -98,6 +102,10 @@
     }
 
     private async Task CreateModule()
+    {
+        validated = true;
+        var interop = new Interop(JSRuntime);
+        if (await interop.FormValid(form))
         {
             try
             {
@@ -118,6 +126,11 @@
                 await logger.LogError(ex, "Error Creating Module");
             }
         }
+        else
+        {
+            AddModuleMessage(SharedLocalizer["Message.InfoRequired"], MessageType.Warning);
+        }
+    }
 
     private bool IsValid(string name)
     {

Oqtane.Client/Modules/Admin/ModuleDefinitions/Edit.razor

@@ -7,26 +7,28 @@
 
 <TabStrip>
     <TabPanel Name="Definition" ResourceKey="Definition">
+        <form @ref="form" class="@(validated ? "was-validated" : "needs-validation")" novalidate>
             <div class="container">
                 <div class="row mb-1 align-items-center">
                     <Label Class="col-sm-3" For="name" HelpText="The name of the module" ResourceKey="Name">Name: </Label>
                     <div class="col-sm-9">
-                    <input id="name" class="form-control" @bind="@_name" />
+                        <input id="name" class="form-control" @bind="@_name" maxlength="200" required />
                     </div>
                 </div>
                 <div class="row mb-1 align-items-center">
                     <Label Class="col-sm-3" For="description" HelpText="The description of the module" ResourceKey="Description">Description: </Label>
                     <div class="col-sm-9">
-                    <textarea id="description" class="form-control" @bind="@_description" rows="2"></textarea>
+                        <textarea id="description" class="form-control" @bind="@_description" rows="2" maxlength="2000" required></textarea>
                     </div>
                 </div>
                 <div class="row mb-1 align-items-center">
                     <Label Class="col-sm-3" For="categories" HelpText="Comma delimited list of module categories" ResourceKey="Categories">Categories: </Label>
                     <div class="col-sm-9">
-                    <input id="categories" class="form-control" @bind="@_categories" />
+                        <input id="categories" class="form-control" @bind="@_categories" maxlength="200" required />
                     </div>
                 </div>
             </div>
+        </form>
         <Section Name="Information" ResourceKey="Information">
             <div class="container">
                 <div class="row mb-1 align-items-center">
@@ -89,6 +91,8 @@
 <AuditInfo CreatedBy="@_createdby" CreatedOn="@_createdon" ModifiedBy="@_modifiedby" ModifiedOn="@_modifiedon"></AuditInfo>
 
 @code {
+    private ElementReference form;
+    private bool validated = false;
     private int _moduleDefinitionId;
     private string _name;
     private string _version;
@@ -145,6 +149,10 @@
     }
 
     private async Task SaveModuleDefinition()
+    {
+        validated = true;
+        var interop = new Interop(JSRuntime);
+        if (await interop.FormValid(form))
         {
             try
             {
@@ -172,4 +180,9 @@
                 AddModuleMessage(Localizer["Error.Module.Save"], MessageType.Error);
             }
         }
+        else
+        {
+            AddModuleMessage(SharedLocalizer["Message.InfoRequired"], MessageType.Warning);
+        }
+    }
 }