I wanted to bind a checkboxlist using KendoUI when a modal pop is opened.
On modal popup load I wanted to get data from a webapi which will have json response and bind it to checkbox kendo Ui template.
I referred kendoUI forums all samples are using static data. Can someone please guide me to the right direction where I can consume dynamic data.
Thank you!
There's a lot of ways to approach this.
I think the easiest way would be to use a TreeView with checkboxes configured that only returns a single level of nodes, then just show it in a Window or Dialog as you would show any other view. This way you get decent, default item formatting of the TreeView with having to use a template, but you don't get paging if your datasource is large.
You can also use a ListView with a template that formats the data with a checkbox. This requires a template but you get paging capability. Once again, you just display the ListView in a Window or Dialog as normal.
Here's a simple demo of a ListView implementation: http://dojo.telerik.com/#Stephen/iwOhIV
It is a combination of Kendo demos: http://demos.telerik.com/kendo-ui/dialog/treeview-integration with the TreeView replaced with the ListView from this demo(http://demos.telerik.com/kendo-ui/listview/remote-data-binding) and then the styling tweak with a template that uses checkboxes.
The rest of it is up to you(persisting/loading checked state, etc).
Related
Firstly, I am doing a research on KendoUI, and my experience is mainly on struts-layout taglib.
And now I got issues on HTML Form while using KendoUI.
My Questions are as below:
Can Kendo ListView be used to replace the html form? That is, there is no Form any more, but a kendo ListView.
If still use html form, how to make each field editable in line (is there any kendo widget to do same behavior as JQuery UI plugin X-editable)?
The closest thing would probably be a Grid that is editable. Clicking on a cell puts it in edit mode: http://demos.telerik.com/kendo-ui/grid/editing
But you could also make a custom Kendo UI widget that behaves basically the same as x-editable by having a clickable element that opens a Kendo Tooltip box with an input element in it.
I would kindly ask for your help :) From couple of days I am trying to achieve "linked" custom field in content editor and dropdown in page editor.
Basically I want to have dropdown in page editor and content editor which are responsible for a same thing.
In my c# code i have enums which represent directions. I created custom field which accepts assembly and class with overridden onload method and successfully populate dropdown values in the content editor. So far so good but i have no idea how to create dropdown which will represent the same functionality inside page editor.
So please give me any ideas...
Judging from your reply to my comment you need to think of the following: How is my field value being rendered onto a page?
If you are always using 1 control to do this then you just need to ensure that this control has 2 different rendering modes depending on the Context.PageMode
But as I understand it you want this dropdown to also appear when someone renders your custom field using a <sc:FieldRenderer>. In this case you'll need to look into the RenderField pipeline of Sitecore. There you find a processor called RenderWebEditing. Possibly through some manipulation here you can get your dropdown appear as you wish.
In KendoUI, how do I select a treeview element if it does not have an ID? Like by the style class or something.
I am writing an MVVM application and there are 2 tabs in a kendo tab strip with each containing a treeview. On selecting one tab, I want it's checkboxes to be updated based on what checkboxes were checked in the other tab and then I want to also call updateIndeterminate() on the treeview it contains within it.
Now, since I am using MVVM, I don't want to access the treeview by it's id. All I can find online on searching is $("#treeView") and in the Telerik forums, the example to call updateIndeterminate() is also this -
var treeview = $("#treeview").data("kendoTreeView");
treeview.updateIndeterminate();
Am I missing something here? I wonder why it's so hard to find.
I suppose the reason why it's hard to find is that it goes against the idea of declarative initialization and the separation of view and model. Your code is not supposed to interact with the widget itself. Instead, all your logic should be wired up in your view model which is bound to the UI.
You can certainly find it without an id, e.g. with something like this:
var treeView = $("ul[data-role=treeview]").first().getKendoTreeView();
or by using the .k-treeview class, but I wouldn't recommend it. If you really need to access it in code, you should give it an id.
I am using a comboBox and for some reason the automaticall triger for the dropdown menu to appear when you have some results is not working. Is there any way to trigger this dynamically. Maybe onChange event?
I am using dojo 1.6!
A code example would be nice so as we can recommend alternatives or better solutions, but in the case that all you want to do is open a dropdown programmatically, you should find openDropDown() and toggleDropDown() functions on the combobox object. If you have the dojo source you can find more dropdown related functions in dijit/_HasDropDown.js, which combo box inherits from.
I need a grid on an MVC3 Razor page that will have to load by JSON or AJAX call. I need this grid to be editable as well.
Also I need the grid to have the ability to have the first 6-8 columns frozen. I looked at the example on Codeproject.com and I couldnt get it to work. My scrollbars would show up but couldnt get the columns to freeze.
I have been working on this using Telerik grids, but it doesnt have the ability to freeze columns by default in a razor setting.
Does anyone have any suggestions on how to implement this or where I could look for some more information?
Try jQuery EasyUI http://www.jeasyui.com/documentation/datagrid.php
I did initially suggest jqGrid: http://www.trirand.com/blog/
but apparently it's a faff to get frozen columns using it.