Kendo MVC: editable grid with local data - kendo-ui

I want to create editable Kendo MVC grid bound to local data(some IEnumerable<>).
I found this and this. But first is only for js and second is not ediatable.
Is it possible?
I have tried all modes of Editable. But Editable() requires to specify related actions and it's impossible to prevent its execution.

As far as I know, editing is not supported with server side binding. In the past, I have used a Template column with links to edit the items. An example:
cols.Template(#<text>Edit</text>)

Related

kendo ui grid with two tables - header and data

I was trying to use the Kendo Grid UI control.
I am using the binding from Javascript with few template columns.
When the HTML is generated it gets two tables, one for header and one for body. This becomes hard for accessibility, can someone please guide me how do I set to generate only one table with header and data in it.
This issue is caused by setting grid to be scrollable. Scrollable property in Kendo UI for jQuery is true by default so you need to explicitly set it false.
If you are using Kendo UI for ASP.NET MVC then you have to remove GridBuilder's .Scrollable() method call.

Kendo UI - Grid questions

I am evaluating Kendo UI for use of it in our project. I would be using the Kendo UI JS (not the ASP.Net MVC one).
I stumbled upon a couple of things Kendo grid does not support. I just want clarification on some of the functionalities (some of the questions may sound very basic. Sorry I am just evaluating on the basis of demos provided and trying to fit in our requirement). I do not require any code but just require your help in evaluating kendo UI
Kendo Grid does not support Grouping of Headers ?
|-----------Header Master------------------|
|--Sub Header-------|-----Sub Header----|
Kendo Grid does not support Frozen Columns ?
Does Kendo Grid support multiple summary columns with custom aggregate(that would be pulled from data source and hence not calculated on client side) ? How can we achieve this ? By Customer Footer template ?
I could not find any example on the website, which shows how kendo ui grid deals with large data. say 10,000 rows ?
Answers to the questions at the current moment (28/10/2013):
Kendo Grid does not support grouped Headers ( you can search the
forums for some feasible work-arounds)
Kendo Grid does not
supported frozen-columns, however it should be implemented for the
future releases.
What is supported as footer templates is
demonstrated here.
What do you mean by larget data? If you
enable server paging only the records for a specific page will be
send to the client, so you can use it with as many records as you
want. Also check virtualization (please notice it still works
the same as a paging mechanism, so you can use it again the same way
as in a regular paging scenario)

Kendo UI grid - different templates for Edit and Create

We are using Kendo UI grid to display some records. The requirements need us to have a column (Say "File Name")shown as a text box when the user clicks on "Edit".
However, when user clicks on the "Create" button in the toolbar, the same column should be replaced with a File Select control which will allow the user to select a file from his machine. The other columns remain the same.
I have already tried searching through Stack Overflow as well as the Kendo UI Grid forums, but to no avail.
Is there any way to achieve this? Any pointers will be of great help.
Regards,
Nikhil
Using different editor templates for create/edit is not supported. You need to use the edit event of the Grid to change that text input to file input with JavaScript. To distinguish between edit and create you can use the isNew() method of the model.
i.e.
edit:function(e){
if(e.model.isNew()){
//replacement logic
}
}
Similar question is covered here.

Telerik MVC Grid sever binding with ajax editing

I have an application that is making extensive use of telerik controls and am looking for an example/demo of Telerik MVC grid that uses server binding to display the initial grid and then allow inline editing using ajax. I have a selection that is returning a lot of data and erroring out at the maxJsonLength. The code to configure the grid would be helpful and I should be able to fiigure out the rest. I think I saw an example somewhere of an ajax bound grid that used server binding for the initial load but I can't find it.
Having a server-side bound grid with ajax editing is possible. However you first need to solve the maxJsonLength problem. The grid needs to serialize the first page of data (which is initially displayed server-side) as JSON so it can be then edited on the client-side. It seems that you are serializing too much data which hits the maxJsonLength limit. I can think of two ways to deal with this:
Use a ViewModel and serialize only the properties which are bound to the grid. This will reduce the total JSON size.
Increase the maxJsonLength. This however is not easy as setting it from web.config does not work in ASP.NET MVC. You need to create a custom JsonResult object with its own JsonSerializer. This code library project shows how.
You have mentioned Telerik in your title but not in main question, so I assume that you are okay with other grid controls.
In that case you can try Jq grid, it's very flexible and easy to use. I have been using it for some time now and find it very useful.
For your particular case see below link
http://www.trirand.com/blog/jqgrid/jqgrid.html

jqGrid using radio buttons for editable rows

I'm currently using jqGrid and ASP.Net MVC. With my current project, my goal is to provide a grid of data to the end user, and they can then edit this. The data is machine-generated, and the users will be confirming if the machine is correct or not.
I think ideally for speed, I'd like to provide a row per item, with a radio button group as the editable. The users could then pick from the values 'Unknown', 'Correct', 'Incorrect'.
As there will be a lot of data, I'd also like to provide a control of some type that can set all rows in the grid to one of the available radio button choices, for the user experience.
Given that there seems to be no native support for this in jqGrid, I wanted to ask if anyone has had any experience writing something like this, and whether this is achievable and reliable, or whether I should stick with the drop-down editable approach that is native to jqGrid.
To implement radio button as the editable instead of the standard drop-down editable approach you can use so named custom editing feature of jqGrid (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules#custom). This allows you to create any custom control to edit the cell value. An example of the implementation you can find here: Add multiple input elements in a custom edit type field.
To set all rows in the grid to one of the available radio button choices you can use either a control outside of jqGrid or add an additional custom button in the navigation bar (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_buttons). If you search for navButtonAdd you will find a lot of examples how to implement this, for example, Jqgrid: navigation based on the selected row. Because you use server based data, you can just call a method on the server to make the changes which you need and then call trigger("reloadGrid") to refresh jqGrid data.

Resources