I have a kendo Grid as follows.
@(Html.Kendo().Grid<RevenueModel>()
.Name("WeeklyRevenue")
.Resizable(resizing => resizing.Columns(true))
.Columns(columns =>
{
columns.Bound(p => p.Number).Width(100);
columns.Bound(p => p.Type).Width(100);
columns.Bound(p => p.Week1).Format("{0:c}");
columns.Bound(p => p.Week2).Format("{0:c}");
columns.Bound(p => p.Week3).Format("{0:c}");
columns.Bound(p => p.Week4).Format("{0:c}");
columns.Bound(p => p.Week5).Format("{0:c}");
columns.Bound(p => p.TotalRevenue).Format("{0:c}");
})
.Scrollable()
.Events(events => events.Change("onChange").DataBound("onDataBound"))
.DataSource(dataSource => dataSource.Ajax().Read(read => read.Action("WeeklyRevenue", "Home")).ServerOperation(false))
.Pageable(pager => pager.Refresh(true))
)
Here is my Controller code
public ActionResult WeeklyRevenue([DataSourceRequest]DataSourceRequest request)
{
...
DataSourceResult result = res.ToDataSourceResult(request);
return Json(result, JsonRequestBehavior.AllowGet);
}
It works fine. But I want to send additional data when Grid reads data, something like the following;
public ActionResult WeeklyRevenue([DataSourceRequest]DataSourceRequest request, string AdditionalParam)
I couldn't find any solution how to do this. Thanks in advance.
If the additional data is known at server-side you should use the overload of the Action method which accepts route values:
.DataSource(dataSource => dataSource.Server()
.Read(read => read.Action("Read", "Home",
new { AdditionalParam = ViewData["AdditionalParam"] }))
)
If this additional data is known at the client-side only you should use the Data method:
.DataSource(dataSource => dataSource.Ajax()
.Read(read => read
.Action("Read", "Home")
.Data("additionalData")
)
)
<script>
function additionalData() {
return {
AdditionalParam: $("#search").val()
};
}
</script>
You can try this;
.Read(read => read.Action("WeeklyRevenue", "Home", new { AdditionalParam = "Test" }))
Or via JavaScript function;
.Read(read => read.Action("Products_Read", "Grid").Data("additionalInfo"))
function additionalInfo() {
return {
AdditionalParam : "test"
}
}
Or full JavaScript;
transport: {
read: {
url: "/Home/WeeklyRevenue",
type: "POST",
contentType: "application/json",
dataType: "json",
data: {
AdditionalParam : "Test"
}
}
}
If you use parameterMap make sure you stringify like following:
parameterMap: function (data, operation) {
if (operation != "read") {
return kendo.stringify(data.models);
}
else if (operation === "read") {
return kendo.stringify(data);
}
}
In controller something like this
public ActionResult Products_Read([DataSourceRequest] DataSourceRequest request, string AdditionalParam) {...}
Further documentation can be found in here and here.
We can use options given below to pass additional parameters.
//object route values
Read(read => read.Action("vs_Read", "vs", new{id=33})
//js function name
Read(read => read.Action("vs_Read", "vs").Data("passAdParam")
//By Template Delegate
Read(read => read.Action("Aggregates_Read", "Grid").Data(@<text>
function() {
//pass parameters to the Read method
return {
name: "test",
id: $("#search").val()
}
}
</text>))
In my case : I have a input type text, and I want my grid load data with filter from my text input, and the grid will load data when I press btnSearch:
@(Html.Kendo().Grid<ARM.Models.UserViewModel>()
.Name("gridUsers")
.Columns(columns =>
{
columns.Bound(c => c.Code);
columns.Bound(c => c.LanID);
columns.Bound(c => c.DepartmentName);
columns.Bound(c => c.UserRole);
columns.Bound(c => c.Level);
})
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("GetUserSample", "ApprovalManager").Data("filterLanID"))
.PageSize(20)
)
)
<script>
function filterLanID() {
return {
lanid: $('#txtFilterUserId').val().trim()
};
}
function btnSearchOnClick(){
$('#gridUsers').data("kendoGrid").dataSource.read();
}
</script>
An the controller :
public ActionResult GetUserSample([DataSourceRequest]DataSourceRequest request, string lanid)
{
IEnumerable<UserViewModel> userModel = GetListUser(lanid);
return Json(userModel.ToDataSourceResult(request));
}