Kendo Grid Ajax Data binding - asp.net-mvc

Question

I am trying to implement the Grid in ASP.NET MVC 5 app. I have use table in razor to test code and is pulling data properly, however i am trying to do server binding using provided Kendo helper classes but i am struggling to pull data to view. I am using Repository pattern and UnitOfWork.... the code is below ...
my 2nd question is, which is the best way to use Multiple Models in Single View???? I have also ViewModel but i havn't use in following code.. can i use #(Html.Kendo().Grid() and #(Html.Kendo().Grid() in same view... many thanks in advanced...
Repository Class:
public IEnumerable<FeeScheme> GetAllFeeScheme()
{
return getAllFeeSchemeFromRepository();
}
UnitOfWork class
private IEnumerable<FeeScheme> getAllFeeSchemeFromRepository()
{
IEnumerable<FeeScheme> query = new List<FeeScheme>();
query = (from b in _FeeScheme_Repository.GetAll()
select b).ToList();
return query;
}
public IEnumerable<FeeScheme> GetAllFeeScheme()
{
return getAllFeeSchemeFromRepository();
}
Controller class
public JsonResult GetAllFeeScheme([DataSourceRequest]DataSourceRequest request)
{
return Json(FeeScheme_UOF.GetAllFeeScheme().ToDataSourceResult(request));
}
View (Kendo )
#(Html.Kendo().Grid<DatabaseLayer.TableMappings.FeeScheme>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(c => c.FeeSchemeID);
columns.Bound(c=>c.FeeSchemeDescription);
columns.Bound(c => c.Fee);
})
.HtmlAttributes(new { style = "height: 380px;" })
.Scrollable()
.Groupable()
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("GetAllFeeScheme", "Qualification"))
.Model(model => model.Id(c=>c.FeeSchemeID))
)
)

Answer 1

The simple question first: To use multiple "view models" in a single view, you would do something like this:
public class TestViewModel
{
public List<Object1> Object1List { get; set; }
public List<Object2> Object2List { get; set; }
public TestViewModel()
{
Object1List = new List<Object1>();
Object2List = new List<Object2>();
}
}
and then use the TestViewModel as the model for the view.
As far as changing your grid to server binding, it would look something like this:
#(Html.Kendo().Grid<>(Model.Object1List)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(c => c.FeeSchemeID);
columns.Bound(c=>c.FeeSchemeDescription);
columns.Bound(c => c.Fee);
})
.HtmlAttributes(new { style = "height: 380px;" })
.Scrollable()
.Groupable()
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.DataSource(dataSource => dataSource
.Server()
.Model(model => model.Id(c=>c.FeeSchemeID))
)
)

Answer 2

which is the best way to use Multiple Models in Single View
First you can use one model that contains lists that you want like:
public Model()
{
public Ilist < Model1 > Model1List
{
get;
set;
}
public IList < Model2 > Model2List
{
get;
set;
}
}
And second you can use Tuple