my project is asp.net core 3.1 and i tried to binding kendo grid with read action. my kendo grid is empty and doesn't show any data
this is my action:
public JsonResult Read([DataSourceRequest] DataSourceRequest request)
{
var data = _context.Products.OrderByDescending(c => c.Id);
DataSourceResult result = data.ToDataSourceResult(request,
model => new Product
{
Id=model.Id,
Title=model.Title
});
//return Json(result, JsonRequestBehavior.AllowGet);
return Json(result);
}
and this is my kendo grid:
#model IEnumerable<DomainModel.Product>
#addTagHelper *, Kendo.Mvc
#using Kendo.Mvc.UI
#(Html.Kendo().Grid<DomainModel.Product>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.Id);
columns.Bound(c => c.Title);
})
.HtmlAttributes(new { style = "height: 550px;" })
.Scrollable()
.Groupable()
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Read", "Products"))
.PageSize(15)
)
)
thanks
Related
I have been working on this Issue for quite some time now.
Basically, I'm using Kendo Grid to display data from Controller to the ViewPage.
But, when I run the view, I Keep getting this error
maxJsonLengthError
How do i rectify this problem?? Appreciate all the help in advance.
Refer to my EDIT
Here is my ControllerCode:-
public ActionResult Index()
{
ViewData["DealsList"] = objDealerModel.listDeals;
return View();
}
And Here is my ViewPage Code:-
#(Html.Kendo().Grid((IEnumerable<WCB.Models.DealerQueue>)ViewData["DealsList"])
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.DealId).Visible(false);
columns.Bound(p => p.DealRefNo).Title("Deal No");
columns.Bound(p => p.CustomerName).Title("Customer Name");
columns.Bound(p => p.DealType).Title("Deal Type");
columns.Bound(p => p.Location).Visible(false);
columns.Bound(p => p.CreatedDate).Title("Created Date");
columns.Bound(p => p.Currency).Title("Currency");
columns.Bound(p => p.Amount).Title("FCY Amount");
columns.Bound(p => p.DealValue).Title("Deal Amount").ClientTemplate("#= kendo.toString(DealValue, 'n') #");
columns.Bound(p => p.Status);
columns.Command(command => command.Custom("ViewDetails").Click("ViewDealDetails")).Title("View");
})
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(20))
.Sortable()
.Scrollable(scr => scr.Height("auto"))
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
)
)
EDIT:
i've tried using this piece of code in myController:-
var jsonResult = Json(objDealerModel.listDeals, JsonRequestBehavior.AllowGet);
jsonResult.MaxJsonLength = int.MaxValue;
return jsonResult;
Can anyone suggest based on this what changes need to be made in my viewPage for KENDO GRID?? Not too familiar with Kendo
I have a same problem and i solve this by setting a higher value for aspnet:MaxJsonDeserializerMembers in the appSettings:
<appSettings>
<add key="aspnet:MaxJsonDeserializerMembers" value="150000" />
</appSettings>
If those options are not working you could try creating a custom json value provider factory using JSON.NET as specified in this thread.
Edit:
Or if this is related to the Kendo Grid binding then you can try this.
public class MySerializer : Kendo.Mvc.Infrastructure.JavaScriptInitializer
{
public override IJavaScriptSerializer CreateSerializer()
{
var serializer = base.CreateSerializer() as DefaultJavaScriptSerializer;
serializer.MaxJsonLength = serializer.MaxJsonLength * 100;
return serializer;
}
}
Kendo.Mvc.Infrastructure.DI.Current.Register<Kendo.Mvc.Infrastructure.IJavaScriptInitializer>( () => newMySerializer() );
I have two <section> in the Index view of my MVC application and I want to render two partial views in these sections. There is no problem rendering a Kendo grid to one Index. However, in order to render data on Kendo Grid, could I use the two methods returning Json in the controller as shown below. Could you give me an example how to achieve this?
Controller:
public ActionResult Index()
{
return View();
}
public ActionResult Issues_Read([DataSourceRequest]DataSourceRequest request)
{
IQueryable<Issue> issues = db.Issues;
DataSourceResult result = issues.ToDataSourceResult(request, c => new IssueViewModel
{
ID = c.ID,
ProjectID = c.ProjectID
});
return Json(result);
}
View:
#(Html.Kendo().Grid<IssueViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.ProjectID);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
})
.ColumnMenu()
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Pageable()
.Navigatable()
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(p => p.ID))
.Read(read => read.Action("Issues_Read", "Issue"))
.Create(create => create.Action("Issues_Create", "Issue" ))
.Update(update => update.Action("Issues_Update", "Issue"))
.Destroy(destroy => destroy.Action("Issues_Destroy", "Issue"))
)
)
In order to use the same partial view multiple times, grid ID should be unique so passing the ID in partial view data is one possible solution. In your case
Partial view first call:
#Html.Partial("grid", new ViewDataDictionary { { "id", "grid1" }})
Partial view second call:
#Html.Partial("grid", new ViewDataDictionary { { "id", "grid2" }})
Partial view content:
#(Html.Kendo().Grid<IssueViewModel>()
.Name(#ViewData["id"].ToString())
...
I'm trying to add a dropdownlist to a kendo grid by the help of this documentation
:
http://demos.telerik.com/aspnet-mvc/grid/editing-custom
Actually I followed exactly the same way but no chance I'm wonder how the kendo grid understand it has to place a dropdownlist in the clientTemplate ?!
does clientTemplate has to be defined somewhere?
You have to define a clientTemplate by adding this to the Grid .ClientDetailTemplateId("template")
Then you can add DropDownList into the template
<script id="template" type="text/kendo-tmpl">
#(Html.Kendo().DropDownList()
//build the dropdownlist
.ToClientTemplate()
)
</script>
Demo: http://demos.telerik.com/aspnet-mvc/grid/detailtemplate
Just to add to the mix of answers, here is a late one...
Create a List in your ViewModel
Treat your Model.PropertyId as a ForeignKey
For example...
columns.ForeignKey(x => x.ChangeTypeId, Model.ChangeTypes, "Id",
"ChangeTypeName")
SAMPLE VIEW:
#(Html.Kendo().Grid<ChangeRequest>()
.Columns(columns =>
{
columns.Bound(x => x.Id)
.Visible(false);
columns.Bound(x => x.Description)
.Title("Description")
.Width(100);
columns.ForeignKey(x => x.ChangeTypeId, Model.ChangeTypes, "Id", "ChangeTypeName")
.Title("Data Type")
.Width(50);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(100);
})
.Name("gridChangeRequest")
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.Scrollable()
.BindTo(Model.RTUDeviceCustomRegisterModbuses)
.DataSource(dataSource => dataSource.Ajax()
.ServerOperation(true)
.PageSize(50)
.Model(model => { model.Id(m => m.Id); })
.Create(update => update.Action("Create", "ChangeRequest", new { Area = "Documents" }))
.Update(update => update.Action("Update", "ChangeRequest", new { Area = "Documents" }))
.Destroy(update => update.Action("Destroy", "ChangeRequest", new { Area = "Documents" }))
)
.HtmlAttributes(new { #class = "", #style = "height: 400px;" }))
SAMPLE VIEW MODEL:
public class ChangeRequestFormViewModel : ViewModelBase
{
#region <Constructors>
public ChangeRequestFormViewModel(IApplication application) : base(application)
{
InitializeCreateEmpty();
}
#endregion
#region <Properties>
public ChangeRequestDocument Entity { get; set; }
#region lookups
public List<ChangeType> ChangeTypes { get; set; }
#endregion
#endregion
#region <Methods>
private void InitializeCreateEmpty()
{
var builder = Application.ChangeRequestDocumentXmlDataSetBuilder; //<-- This object is specific to my (particular) application
var dataset = builder.CreateEmpty();
Entity = dataset.Form;
ChangeTypes = dataset.ChangeTypes;
}
#endregion
}
I am trying to bind my KendoUI grid and I am getting a 500 server error in the console. The only thing I can think of is that it doesn't like "#(Html.Kendo().Grid()" but intellisense does not error out. Does it seem like something is setup wrong with my project? Any advice would be greatly appreciate. Below is what I have in my controller and Index.cshtml page.
public ActionResult Customers_Read([DataSourceRequest]DataSourceRequest request) {
using (var ctx = new DataEntities()) {
IQueryable<Customer> customers = ctx.Customers;
DataSourceResult result = customers.ToDataSourceResult(request);
return Json(result);
}
#(Html.Kendo().Grid<DataLibrary.Customer>()
.Name("grid")
.Columns(columns => {
columns.Bound(c => c.Name);
columns.Bound(c => c.Phone);
columns.Bound(c => c.Fax);
columns.Bound(c => c.Website);
})
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Customers_Read", "Customers"))
)
)
Does your Customer_Read method work ok?
Is the result variable populated with the results of the search?
Try adding AllowGet property.
return Json(result, JsonRequestBehavior.AllowGet);
I'm trying to launch a Kendo grid in a Kendo popup Window but instead of the grid showing, I'm getting the json data.
This is the code from my controller:
[HttpGet]
public ActionResult Read([DataSourceRequest]DataSourceRequest request, int id)
{
var model = Service.FindOne("Cashflows", x => x.Id == id);
var cashflows = new List<flows>();
foreach (var cf in model.CashFlows)
{
var flow = new flows
{
Id = cf.Id,
AssetId = cf.Id,
MortgageValue = cf.MortgageValue,
Year = cf.Year
};
cashflows.Add(flow);
}
var result = cashflows.ToDataSourceResult(request);
return Json(result, JsonRequestBehavior.AllowGet);
}
This is what I have in my Kendo View.
#(Html.Kendo().Grid<ViewModels.Finance.flows>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.Id);
columns.Bound(p => p.AssetId);
columns.Bound(p => p.Year);
columns.Bound(p => p.MortgageValue);
})
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Read", "Finance"))
.ServerOperation(false)
.PageSize(5)
)
.Pageable()
)
You need to update the return command to:
return Json(result.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);