Getting error while binding checkbox in Kendo Grid - asp.net-mvc

Getting below error while binding Kendo MVC Grid for select box.
(44): error CS1501: No overload for method 'Select' takes 0 arguments
Below is the my code:
#{Html.Kendo().Grid(Model)
.Name("EmpGrid")
.Pageable()
.Filterable()
.DataSource(d => d
.Server()
.Model(model => model.Id(p => p.empId))
.PageSize(25)
)
.Columns(columns =>
{
columns.Select();
columns.Bound(r => r.Name).Width(160);
}).Render();
}
Please suggest me where I am doing wrong.
If I removes "columns.Select();" from columns it's working.
Thanks.

I think due to Kendo old version it's not binding. Accomplished it by using template option like below.
columns.Template(#<text><input type="checkbox"/></text>).HeaderTemplate(#<text><input type="checkbox" /></text>); columns.Template(#<text><input type="checkbox"/></text>).HeaderTemplate(#<text><input type="checkbox" /></text>);
Thanks

Related

Make Kendo ASP.NET MVC inCell Editable based on Viewbag condition

Is it possible to make a Kendo MVC grid .Editable() based on a function that allows editing ONLY if you have a certain Viewbag?
I have a viewbag that is Viewbag.DisplayButton. That viewbag is only 'true' if you have a dev role (so non-devs cannot edit anything). How can I make this work with .Editable() so that you can only edit cells if you have that viewbag?
Currently if I set Editable(true) then anyone (devs, customers, literally anyone) can edit the cell. If I set it to Editable(false) then no one, including devs, can edit it. So I need a function that does it only if you have that specific viewbag.
Use a Razor code block for this. You can assign the Grid definition to a variable, then execute the conditional logic and add the additional configurations, if any. Finally call the Render method. Here is an example:
<h3>Some content</h3>
#{
var isAdmin = true;
var grid = (Html.Kendo().Grid<MyModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.MyModelID).Filterable(false);
columns.Bound(p => p.SomeModelProperty);
})
.Pageable()
.Scrollable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Model(m=>m.Id("MyModelID"))
.Read(read => read.Action("Read", "Grid"))
)
);
if (User.IsInRole("Admin"))
{
grid.Editable(e=>e.Mode(GridEditMode.InCell));
}
grid.Render();
}
<h3>Some other content</h3>

Kendo MVC Grid Default Sort by Multiple Column Fails

#(Html.Kendo().Grid<...>()
.Columns(columns =>
{
columns.Bound(j => j.Type);
columns.Bound(j => j.Code);
})
.Sortable(s => s.Enabled(true))
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Sort(p => { p.Add("Code").Ascending(); p.Add("Type").Ascending(); })
.Model(model => model.Id(j => j.ID))
.Read(...)
.ServerOperation(true)
)
)
I have a Kendo MVC Grid as above and want to sort it first by type, then by code.
I have found such implementation on official Telerik forum: Default Grid Sorting
However it seems it fails to work...
The records are sorted by two columns, and apparently it is sorted by Type, but it fails to sort by Code afterwards...As Default should after CG...
What am I missing and how can I fix the problem?
For anyone else looking for a solution, using the model property names worked for me, i.e.
.Sort(s =>
{
s.Add("Code").Ascending();
s.Add("Type").Ascending();
})
Try this way
.Sort(p=> {p.Add(s=>s.Code).Ascending(); p.Add(s=>s.Type).Ascending();})

MVC Kendo UI Grid - 100 + columns

I have a Kendo UI GRID (MVC) with 100+ columns.
Not all the columns are visible on load. The default columns visible are 10.
There are checkboxes on the page, next to the grid, which list all the columns. If you click on a checkbox, depending on whether it is checked or unchecked, the column appears or is hidden.
The trouble is that the grid takes almost 20 seconds to render, when the number of rows is also huge (and the time increases).
What is the best way to handle a large number of columns?
I think that bring all the 100 columns for a record is not the best way to work. Maybe you must most important information (10 column at max) for all the records and have a detailed view (with the rest of the information for the specific record you want to inspect)
If you want to see a more detailed example take a look here
my approach is the following
#(Html.Kendo().Grid<YOURCLASS>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(e => e.imporantColumn1);
columns.Bound(e => e.imporantColumn2);
columns.Bound(e => e.imporantColumn3);
})
.Sortable()
.Pageable()
.Scrollable()
.ClientDetailTemplateId("template")
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(read => read.Action("HierarchyBinding_theBasicData", "Grid"))
)
.Events(events => events.DataBound("dataBound"))
)
and a detailed template
<script id="template" type="text/kendo-tmpl">
#(Html.Kendo().TabStrip()
.Name("tabStrip_#=ID#")
.SelectedIndex(0)
.Items(items =>
{
items.Add().Text("details").Content(#<text>
#(Html.Kendo().Grid<YOURCLASS>()
.Name("grid_#=ID#")
.Columns(columns =>
{
// the order columns
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(read => read.Action("HierarchyBinding_theRestOfInfo", "Grid", new { ID= "#=ID#" }))
)
.Pageable()
.Sortable()
.ToClientTemplate())
</text>
);
})
.ToClientTemplate())
</script>

ASP.NET MVC Telerik Grid: How to make one column read only on edit?

I have an ASP.NET MVC Telerik Grid (not Kendo). I have a grid with two columns. The first column is a drop down list of items I can select from, and the second column is just an editable textbox.
I want to set the first column to READ ONLY on edits, meaning I can only edit the second column but not the first column. I set the first column to read only in both the model ([ReadOnly] tag in the model class) and in the view (i.e. Editable(false)).
When I do this, I'm not allowed to edit the first column in edit mode like I want. However, when I go to insert/create a new record... the first column is blank and I can only enter values for the second column.
I've tried everything and looked around, but couldn't find a solution.
try this :
model.Field(p => p.Name).Editable(false)
Example:
#(Html.Kendo().Grid<OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.Id).Sortable(false).Visible(false);
columns.Bound(p => p.Name);
columns.Bound(p => p.Notes);
columns.Command(command => { command.Edit(); }).Width(172);
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("Orders_Read", "Grid"))
.Model(model => {
model.Id(p => p.Id);
model.Field(p => p.Name).Editable(false);
})
.Update(update => update.Action("EditingInline_Update", "Grid"))
)
)
Ref: http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/configuration#model
I had a similar issue with a text field. I solved it by hooking the Edit event.
#Html.Kendo().Grid<MyViewModel>()...Events(e => e.Edit("onGridEdit"))
<script type="text/javascript">
function onGridEdit(e) {
if (!e.model.isNew())
e.container.find('input#ID').prop('disabled', true);
}
</script>
In this example I wanted my ID field to be unchangeable after it's created. Your mileage and jQuery may vary, but I suspect the solution would be similar.
TL;DR;
If you are using grid template columns, keep the EditItemTemplate empty as follows:
<telerik:GridTemplateColumn DataField="opt_id" UniqueName="opt_id" DataType="System.Int32">
<ItemTemplate>
<telerik:RadLabel Text='<%# DataBinder.Eval(Container.DataItem, "opt_id") %>' runat="server" />
</ItemTemplate>
<EditItemTemplate></EditItemTemplate>
</telerik:GridTemplateColumn>
So by using above, when entered into edit mode, the item will still be read only.

The call is ambiguous between the following methods - Kendo UI

I recently migrated a web application from Telerik Mvc to Kendo UI,
but I'm running into a snag that I'm not too sure how to modify since
I've been learning more about and getting used to Kendo UI the past week.
Here is the problem I'm running into. The error states:
The call is ambiguous between the following methods or
properties: 'System.Linq.Enumerable.Where<Model_OpenAccess_AssetMgr.Custody>
(System.Collections.Generic.IEnumerable<Model_OpenAccess_AssetMgr.Custody>,
System.Func<Model_OpenAccess_AssetMgr.Custody,bool>)'
and 'System.Linq.Enumerable.Where<Model_OpenAccess_AssetMgr.Custody>
(System.Collections.Generic.IEnumerable<Model_OpenAccess_AssetMgr.Custody>,
System.Func<Model_OpenAccess_AssetMgr.Custody,bool>)'
And the code where the error is occurring is below:
#model List<Model_OpenAccess_AssetMgr.Custody>
<div id="AssetDescription" class="detailContainer detailContainer3">
<header class="sectionheader" > Custodians </header>
#(Html.Kendo().Grid(Model.Where(x=>x.Active==true))
.Name("grd_Admin_Custodians")
.HtmlAttributes(new { #class = "ItemsGrid" })
.ToolBar(commands => commands.Create())
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(o => o.Custody_PK))
)
.DataSource(dataSource => dataSource
.Server()
.Read(read => read.Action("AdminHome", "Admin", new { view ="Custodies" }))
.Create("Create", "Admin", new { id = 0, view = "Custodies" })
.Update("Save", "Admin", new { view = "Custodies" })
.Destroy("Delete", "Admin", new { view = "Custodies" }))
.Columns(columns =>
{
columns.Bound(o => o.Custody_Name).Width(200);
columns.Bound(o => o.Custody_Dept).Width(150);
columns.Bound(o => o.Custody_eraider).Width(130);
columns.Bound(o => o.Custody_Type).Width(130);
columns.Bound(o => o.Custody_Email).Width(220);
{
commands.Edit();
commands.Destroy();
}).Width(210);
}
)
.Scrollable(scrolling => scrolling.Enabled(true)}
.Scrollable(scrolling => scrolling.Height(550))
.Pageable()
.Sortable()
)
</div>
)
(Model.Where(x=>x.Active==true) is what is being flagged.
Now, I also have a warning listed at the top underneath
#model List that states:
ASP.NET runtime error: Method not found 'Void
System.Web.Razor.RazorEngineHost.set_EnableInstrumentation(Boolean)'
Which I'm quite certain is interconnected with the error I'm getting.
Do I need to modify the Model.Where() statement somehow?
What do you think I should use instead for Kendo UI?
On another note I recently upgraded this web application project from MVC3 to MVC4
so I don't know if that has anything to do with this or not. But I wanted to go ahead
and let you know of that fact as well.
I've looked at other responses but it appears no one has asked about this for Kendo UI specifically.
Thanks!
It looks to me like you are mixing Server side rendering and Ajax rendering. If using Server side rendering of your grid, you should perform the Where(x=>x.Active==true) filtering in your Model (preferably) or in the Controller Action (less ideal) that uses this view. Not in the view.
If using an Ajax to get the data, say for a paged grid, your datasource needs a read method like
.Read(read => read.Action("Custodians", "Admin"))

Resources