changed select to autocompleted

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Contents/AddWidgetModal.cshtml

@@ -11,19 +11,18 @@
 }
 
 @section scripts
-{
+    {
     <abp-script src="/Pages/CmsKit/Contents/addWidgetModal.js" />
 }
 
-<abp-modal size="Large" id="addWidgetModal">
+    <abp-modal size="Large" id="addWidgetModal">
-    <abp-modal-header title="@L["AddWidget"].Value"></abp-modal-header>
+        <abp-modal-header title="@L["AddWidget"].Value"></abp-modal-header>
-    <abp-modal-body>
+        <abp-modal-body>
-        <div class="container row">
+            <div class="container row">
-            @if(Model.Widgets.Count() > 1)
+                @if (Model.Widgets.Count() > 1)
             {
                 <abp-select asp-for="ViewModel.Widget" />
-                <div id="polls" hidden>@await Component.InvokeAsync("CmsPolls")</div>
+                <div id="polls">@await Component.InvokeAsync("CmsPolls")</div>
-                @*<div id="polls" hidden><abp-select id="Widget" asp-for="ViewModel.Widget" /></div>*@
                 <div id="PropertySideId">
                 </div>
                 <button class="btn btn-primary float-end" type="submit" id="save-changes">@L["Add"]</button>

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Contents/addWidgetModal.js

@@ -14,9 +14,6 @@ $(function () {
                     var firstWidgetType = widgetTypes[0];
                     if (firstWidgetType.key == "Poll") {
                         $("#polls").removeAttr("hidden");
-                        let widgetKey = $('#Widget').find('option:selected').val();
-                        let html = " <input hidden class=\"properties form-control\" value=\"" + widgetKey + "\" id=\"Code\" type=\"text\" />"
-                        $("#PropertySideId").append(html);
                     }
                     else {
                         for (const property of firstWidgetType.properties) {
@@ -30,9 +27,9 @@ $(function () {
                 });
             });
 
-            $("#Widget").change(function () {
+            $("#WidgetCode").keyup(function (e) {
                 $("#PropertySideId").html('');
-                let widgetKey = $(this).find('option:selected').val();
+                let widgetKey = $(this).val();
                 let html = " <input hidden class=\"properties form-control\" value=\"" + widgetKey + "\" id=\"Code\" type=\"text\" />"
                 $("#PropertySideId").append(html);
             });