Hello, av been using Kendo UI about a week now, I was wondering if the following was possible:
1. change the layout from treeview/Treelist to a grid, but it should come as a dialog (see attached image)
2. How to do I change the datasource to point to a location/file that is located locally?
5 Answers, 1 is accepted
Hi Joshua,
If I am understanding your question correctly, the attached example should be demonstrating what you want to implement. The attached archive contains an example of a Grid that is loaded in a dialog window and the data displayed in the Grid is sourced locally.
The data in the example is sourced from the products.js file you can find in the archive.
Check the attached example and let me know if it demonstrates what you want to implement. Let me know if you have any questions about the provided example.
Regards,
Petar
Progress Telerik
Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive , special prizes and more, for FREE?! Register now for DevReach 2.0(20).
Rank 1
Veteran
Hello,
I managed to resolve the issue.
But I have another issue with the combobox
How do I activate the *filter feature* with the code below
<body>
<div>
<asp:dropdownlist class="k-combobox" runat="server" style="width: 50%;"></asp:dropdownlist>
</div>
<script>
function pageLoad(){
$(".k-combobox").kendoComboBox();
}
</script>
</body>
Hello Joshua,
To active the filter feature, the filter configuration of the ComboBox should be configured on the component's initialization.
You can check this Dojo example. The filter property is commented in the definition of the ComboBox and there is no filtering applied when searching for a value. If you uncomment the filter configuration, the filtering will be activated.
Regards,
Petar
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 1
Veteran
Hello,
thank you for the reply. Kindly note that I need the example in <asp:dropdownlist> as specified above.
Hello Joshua,
Our colleague Petar is currently on a vacation until Sept 27-th. What I can see from your previous replies is that you are using asp:dropdownlist and initialize kendoComboBox from it. There are a couple of options for initializing Kendo combobox:
- From a pure HTML input/select element e.g. "<input id="fabric" placeholder="Select fabric..." style="width: 100%;" />" or <select id="size" placeholder="Select size..." style="width: 100%;" > as it is demonstrated in our jQuery basic usage demo:
https://demos.telerik.com/kendo-ui/combobox/index - In MVC/Core projects (WebForms is not supported) by using the HTML helpers or Tag helpers:
https://demos.telerik.com/aspnet-mvc/combobox :@(Html.Kendo().ComboBox() .Name("fabric") .Filter("contains") .Placeholder("Select fabric...") .DataTextField("Text") .DataValueField("Value") .BindTo(new List<SelectListItem>() { new SelectListItem() { Text = "Cotton", Value = "1" }, new SelectListItem() { Text = "Polyester", Value = "2" }, new SelectListItem() { Text = "Cotton/Polyester", Value = "3" }, new SelectListItem() { Text = "Rib Knit", Value = "4" } }) .SelectedIndex(3) .Suggest(true) .HtmlAttributes(new { style="width:100%;" }) )
https://demos.telerik.com/aspnet-core/combobox/tag-helperYou could consider using one of these options for implanting your scenario.<kendo-combobox name="orders" style="width:100%" datatextfield="ShipName" datavaluefield="OrderID" min-length="3" template="#= OrderID # | For: #= ShipName #, #= ShipCountry #" height="520" filter="FilterType.Contains"> <datasource type="DataSourceTagHelperType.Ajax" page-size="80"> <transport> <read url="@Url.Action("TagHelper_Virtualization_Read", "ComboBox")" /> </transport> </datasource> <virtual item-height="26" value-mapper="valueMapper" /> <popup-animation> <open duration="500" /> <close duration="500" /> </popup-animation> </kendo-combobox>
In case of Webforms you could refer to ASP .NET AJAX product which is different from Kendo UI:
https://demos.telerik.com/aspnet-ajax/combobox/examples/overview/defaultcs.aspx
I hope this helps.
Wish you a great day!
Best Regards,
Misho
Progress Telerik
Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).