Added select-box instead on input

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

@@ -16,15 +16,16 @@
 }
 
 <abp-modal size="Large" id="addWidgetModal">
-
     <abp-modal-header title="@L["AddWidget"].Value"></abp-modal-header>
-
     <abp-modal-body>
         <div class="container row">
-            @if(Model.Widgets.Count() > 1){
-            <abp-select asp-for="ViewModel.Widget" />
-            <div id="PropertySideId">
-            </div>
+            @if(Model.Widgets.Count() > 1)
+            {
+                <abp-select asp-for="ViewModel.Widget" />
+                <div id="polls" hidden>@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>
             }
             else
@@ -33,5 +34,4 @@
             }
         </div>
     </abp-modal-body>
-    
 </abp-modal>

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

@@ -12,16 +12,31 @@ $(function () {
                 volo.cmsKit.admin.contents.contentAdmin.getWidgets().then(function (data) {
                     var widgetTypes = data.items.filter(v => v.key === widgetType);
                     var firstWidgetType = widgetTypes[0];
-                    for (const property of firstWidgetType.properties) {
-                        let html = "<div class=\"form-group\"> " +
-                            " <label for=\"" + property.key + "\">" + property.name + "</label>" +
-                            " <input class=\"properties form-control\" id=\"" + property.key + "\" type=\"text\" />" +
-                            " </div>";
+                    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) {
+                            let html = "<div class=\"form-group\"> " +
+                                " <label for=\"" + property.key + "\">" + property.name + "</label>" +
+                                " <input class=\"properties form-control\" id=\"" + property.key + "\" type=\"text\" />" +
+                                " </div>";
+                            $("#PropertySideId").append(html);
+                        }
+                    }
                 });
             });
 
+            $("#Widget").change(function () {
+                $("#PropertySideId").html('');
+                let widgetKey = $(this).find('option:selected').val();
+                let html = " <input hidden class=\"properties form-control\" value=\"" + widgetKey + "\" id=\"Code\" type=\"text\" />"
+                $("#PropertySideId").append(html);
+            });
+
             $("#save-changes").click(function () {
                 var keys = [];
                 var values = [];