Add validation for MenuItem URL

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Menus/MenuItems/CreateModal.cshtml

@@ -19,7 +19,7 @@
     Layout = null;
 }
 
-<form asp-page="/CmsKit/Menus/MenuItems/CreateModal">
+<form id="menu-item-form" asp-page="/CmsKit/Menus/MenuItems/CreateModal">
     <abp-modal id="menu-create-modal">
         <abp-modal-header title="@L["New"].Value"></abp-modal-header>
         <abp-modal-body>
@@ -27,7 +27,7 @@
             <abp-tabs tab-style="Tab">
                 <abp-tab name="url" title="@L["Url"]">
                 
-                    <abp-input asp-for="ViewModel.Url"/>
+                    <abp-input asp-for="ViewModel.Url" />
 
                 </abp-tab>
                 <abp-tab title="@L["Page"]">

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Menus/MenuItems/CreateModal.cshtml.cs

@@ -52,6 +52,7 @@ public class CreateModalModel : CmsKitAdminPageModel
 
         public bool IsActive { get; set; } = true;
 
+        [Required]
         public string Url { get; set; }
 
         public Guid? PageId { get; set; }

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Menus/MenuItems/UpdateModal.cshtml

@@ -19,7 +19,7 @@
     Layout = null;
 }
 
-<form asp-page="/CmsKit/Menus/MenuItems/UpdateModal">
+<form id="menu-item-form" asp-page="/CmsKit/Menus/MenuItems/UpdateModal">
     <abp-modal id="menu-update-modal">
         <abp-modal-header title="@L["New"].Value"></abp-modal-header>
         <abp-modal-body>

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Menus/MenuItems/UpdateModal.cshtml.cs

@@ -50,6 +50,7 @@ public class UpdateModalModel : CmsKitAdminPageModel
 
         public bool IsActive { get; set; }
 
+        [Required]
         public string Url { get; set; }
 
         public string Icon { get; set; }

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Menus/MenuItems/createModal.js

@@ -7,36 +7,22 @@ $(function () {
             var $pageId = $('#ViewModel_PageId');
             var $url = $('#ViewModel_Url');
             var $displayName = $('#ViewModel_DisplayName');
-            var $pageIdClearButton = $('#url-tab');
-            
-            //initSelectPageId();
-            
+            var $menuItemForm = $('#menu-item-form');
+
             $pageId.on('change', function (params) {
                 $url.prop('disabled', $pageId.val());
                 
                 if ($pageId.val())
                 {
                     if (!$displayName.val()){
-                        $displayName.val($pageId.text());
+                        $displayName.val($pageId.text().trim());
                     }
                 }
             })
-            
-            $pageIdClearButton.click(function (){
-                $pageId.val('');    
-                $pageId.trigger('change');    
-            })
-            
-            function initSelectPageId() {
-                $pageId.data('autocompleteApiUrl', '/api/cms-kit-admin/menu-items/lookup/pages');
-                $pageId.data('autocompleteDisplayProperty', 'title');
-                $pageId.data('autocompleteValueProperty', 'id');
-                $pageId.data('autocompleteItemsProperty', 'items');
-                $pageId.data('autocompleteFilterParamName', 'filter');
-                $pageId.data('autocompleteParentSelector', '#menu-create-modal');
 
-                abp.dom.initializers.initializeAutocompleteSelects($pageId);
-            }
+            $menuItemForm.on('submit', function (e) {
+                $('[href="#url"]').tab('show');
+            });
         };
 
         return {

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Menus/MenuItems/updateModal.js

@@ -7,6 +7,7 @@ $(function () {
             var $pageId = $('#ViewModel_PageId');
             var $url = $('#ViewModel_Url');
             var $displayName = $('#ViewModel_DisplayName');
+            var $menuItemForm = $('#menu-item-form');
 
             $pageId.on('change', function (params) {
                 $url.prop('disabled', $pageId.val());
@@ -19,6 +20,10 @@ $(function () {
             })
 
             $pageId.trigger('change');
+
+            $menuItemForm.on('submit', function (e) {
+                $('[href="#url"]').tab('show');
+            });
         };
 
         return {