I have a Kendo chart looking like:
#(Html.Kendo().Chart<SchoolYearWorkScheduleModel>()
.Name("chart")
.Title("Beskæftigelses Graf")
.Legend(legend => legend
.Position(ChartLegendPosition.Left)
)
.DataSource(ds => ds.Read(read => read.Action("Read", "EmploymentGraph")))
.Series(series =>
{
series.Line(model => model.TotalWorkHours).Name("Total Beskæftigelse").Markers(z => z.Visible(false)).Style(ChartLineStyle.Normal);
...
CONTROLLER:
[HttpPost]
public ActionResult Read()
{
var res = _schoolYearWorkScheduleRepository.GetModel();
return Json(res);
}
Repository:
public SchoolYearWorkScheduleModel GetModel()
{
schoolYearWorkScheduleModel.ID = DateTime.Now.SchoolYear();
schoolYearWorkScheduleModel.TotalWorkHours = TotalWorkHours(DateTime.Now, 1);
return schoolYearWorkScheduleModel;
}
The Json result that the controller Read method returns gives me the data, that it should. But nothing at all shows up in the chart graph. And I cannot see what I am doing wrong. ?
You can add new property to your class for the new list and add two series in your chart.
If this is not what you are looking for can you please also specify what you are trying achieve with two lists and what you want the output in chart.
Related
Using Kendo DropdownList for MVC, trying to identify why the DropdownList will not accept this data.
#(Html.Kendo().DropDownList()
.Name("CompanyList") //The name of the DropDownList is mandatory. It specifies the "id" attribute of the widget.
.DataTextField("Table")
.DataValueField("COM_NAME")
.DataSource(source =>
{
source.Custom() // Read(read =>
.Type("json")
.Transport(transport =>
{
transport.Read("GetallCompanies", "Home");
})
.ServerFiltering(true); //If true, the DataSource will not filter the data on the client.
})
.SelectedIndex(0) //Select the first item.
)
The raw data from the SQL action has this format:
"{\"Table\":[{\"ORG_ID\":265498,\"COMPORGID\":239597,\"COM_NAME\":\"ABC Rentals \"},{\"ORG_ID\":164929,\"COMPORGID\":239698,\"COM_NAME\":\"Asbury Machine Shop \"}]}"
Have referenced the Kendo docs and other SO examples. Put the JSON into a validator tool, says its correctly formatted.
In the page, the drop down has a left curly brace, { as the top item, and when clicking there are dozens of: Undefined.
The DataTextField was called "Table" because of the "Table" in the JSON array, but it was set to COM_NAME. The Controller Method,
[HttpGet]
public JsonResult GetallCompanies()
{
var ddx = CompInfo.GetAllCompanies(); //returns dataset
string thedata = JsonConvert.SerializeObject(ddx);
return Json(thedata, JsonRequestBehavior.AllowGet);
}
I don't think you need to use SerializeObject on ddx aswell as the Json method before returning to the client. Can you try changing GetAllCompanies to:
[HttpGet]
public JsonResult GetallCompanies()
{
var ddx = CompInfo.GetAllCompanies(); //returns dataset
//string thedata = JsonConvert.SerializeObject(ddx);
return Json(ddx);
}
Summary of the Json method:
Creates a Microsoft.AspNetCore.Mvc.JsonResult object that serializes the specified data object to JSON.
Try this:
Server-side: Leave the JsonConvert.SerializeObject line commented out.
Client-side: Add the following to the DropDownList configuration (e.g. after .SelectedIndex(0)):
.Schema(schema => schema.Data("Table"))
I'm trying to include a Kendo UI ASP.NET MVC Grid on the Edit page of my MVC application and I would like to restrict that grid to only return values from the current route id. I've been researching ways to do this, but can't find anything that's exactly what I need, or I'm just too new at this to connect the dots.
My ideas so far are to either apply a filter to the DataSource or send a parameter to the controller and have it restrict the DataSourceResult.
For the DataSource filter in the view, I can do this:
.Filter(filters => { filters.Add(d => d.CompanyId).IsEqualTo(2); })
But I can't figure out how to replace the hardcoded 2 with the value from, say, #ViewContext.RouteData.Values["id"], or something.
Passing a parameter to the controller, I can get the following:
public ActionResult Divisions_Read([DataSourceRequest]DataSourceRequest request, int id)
{
using (var db = new AppContext())
{
IQueryable<Division> divisions = db.Divisions;
DataSourceResult result = divisions.ToDataSourceResult(request, division => new DivisionViewModel
{
DivisionId = division.DivisionId,
CompanyId = division.CompanyId,
CountryId = division.CountryId,
DivisionName = division.DivisionName
});
return Json(result);
}
}
But I have no idea how to use that id to basically add a "where CompanyId = Id" statement to the result.
Any ideas on what the best way to do this would be? Am I missing something really obvious?
Thanks!
ETA: Passing the parameter to the Controller through the Read action, as suggested by mmillican and other places in my research, and changing
DataSourceResult result = divisions.ToDataSourceResult(request, division => new DivisionViewModel
to
DataSourceResult result = divisions.Where(c => c.CompanyId == companyId).ToDataSourceResult(request, division => new DivisionViewModel
did the trick. That extra bit in the controller was what I was looking for, but couldn't seem to find anywhere.
Assuming you have a model for your page that looks like this:
public class MyViewModel
{
public int Id { get; set; } // assuming Id is what you want to filter by
// .. other VM properties
}
you can do something like this in your grid data binding
.DataSource(ds => ds
.Ajax()
.Model(mdl => mdl.Id(x => x.Id))
.Read("Divisions_Read", "Divisions", new { id = Model.Id })
)
in your controller, you would set the model's Id property to whatever ID that is in the route.
I am using a ViewModel Class to bind to a KendoUI grid and it call works well until I try to sort (or filter). It all works ok until I try sort on UserName. I am sure it is because UserName is not a property of my entity model (ErrorLog)
public ActionResult ListErrors([DataSourceRequest]DataSourceRequest request)
{
IQueryable<ErrorLog> errorLogs = (IQueryable<ErrorLog>)db.ErrorLogs.Include(e => e.User).OrderByDescending(e => e.ErrorLogId);
DataSourceResult result = errorLogs.ToDataSourceResult(request, errorLog => new ErrorLogViewModel
{
ErrorLogId = errorLog.ErrorLogId,
Message = errorLog.AdditionalMessage,
UserName = errorLog.User.UserName
});
return Json(result);
}
This scenario doesn't seem to covered in the Kendo MVC documentation.
Solved by invoking ToDataSourceResult after my db query had run:
public ActionResult ListErrors([DataSourceRequest]DataSourceRequest request)
{
IQueryable<ErrorLog> errorLogs = (IQueryable<ErrorLog>)db.ErrorLogs.Include(e => e.User).OrderByDescending(e => e.ErrorLogId);
DataSourceResult result = errorLogs.Select(errorLog => new ErrorLogViewModel
{
ErrorLogId = errorLog.ErrorLogId,
Message = errorLog.AdditionalMessage,
Timestamp = errorLog.Timestamp,
UserName = errorLog.User.UserName
}).ToDataSourceResult(request);
return Json(result);
}
Please try the KendoGridBinderEx project instead of [DataSourceRequest], together with AutoMapper this scenario should be work fine.
For a demo see here.
The kendo dropdownlistfor shows the accurate undefined number of record in dropdown, but it do not show the Item Name. Please help in this regards, Thanks
**Controller**
var cdd = db.Items.Select(x => new
{
x.ItemID,
x.ItemName
}).ToList();
var viewmodel= new Accounting.DAL.Item();
var selec = new SelectList(cdd, "ItemID", "ItemName");
viewmodel.ItemsDrop = selec;
return View(viewmodel);
**Model**
public SelectList ItemsDrop { get; set; }
**View**
#(Html.Kendo()
.DropDownListFor(m => m.ItemName)
.Name("ItemName")
.DataTextField("ItemName")
.DataValueField("ItemID")
.BindTo(Model.ItemsDrop)
)
You're passing a select list to the view so your dropdownlist should look like this:
#(Html.Kendo()
.DropDownListFor(m => m.ItemName)
.Name("ItemName")
.DataTextField("Text")
.DataValueField("Value")
.BindTo(Model.ItemsDrop)
)
If you're controller was just passing a Json result like this:
return Json(cdd.Select( p => new {ItemName = p.ItemName, ItemID = p.ItemID}), JsonRequestBehavior.AllowGet);
then how you had your dropdownlistfor() would be fine as is.
I have an MVC3 Telerik app. This is my controller:
[GridAction]
public ActionResult Index(GridCommand command)
{
IEnumerable<Order> data = GetData(command);
var dataContext = new NorthwindDataContext();
//Required for pager configuration
ViewData["total"] = dataContext.Orders.Count();
return View(data);
}
[GridAction(EnableCustomBinding = true)]
public ActionResult _CustomBinding(GridCommand command)
{
IEnumerable<Order> data = GetData(command);
var dataContext = new NorthwindDataContext();
return View(new GridModel
{
Data = data,
Total = dataContext.Orders.Count()
});
}
//Utility method which does custom paging and sorting using Linq
private static IEnumerable<Order> GetData(GridCommand command)
{
var dataContext = new NorthwindDataContext();
IQueryable<Order> data = dataContext.Orders;
if (command.PageSize > 0)
{
data = data.Skip((command.Page - 1) * command.PageSize);
}
data = data.Take(5);
return data;
}
This is my razor View:
#model IEnumerable<Telerik.Order>
#(Html.Telerik().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(o => o.OrderID).Width(100);
columns.Bound(o => o.Customer.ContactName).Width(200);
columns.Bound(o => o.ShipAddress);
columns.Bound(o => o.OrderDate).Format("{0:MM/dd/yyyy}").Width(100);
})
.DataBinding(dataBinding =>
{
dataBinding.Ajax().Select("_CustomBinding", "Home").Enabled(true);
})
.Pageable(pager => pager.Total((int)ViewData["total"]))
.EnableCustomBinding(true)
.Sortable()
)
When I run the app, it loads fine, but when I click on a number in the paging row at the bottom, I get :
Error! The requested URL returned 500- Internal server error
It calls my function _CustomBinding and doesnt throw an error when i step through it. Whats causing this error?
This means that a server side exception has occurred in _CustomBinding method. You can check what the actual server response is - it would contain the stacktrace. Use Fiddler or your browser's developer tools to check what the server response is.