Questions on UI for ASP.NET MVC Forum

1 answer

505 views

Minimum Script & Style Reference for Kendo MVC Complete?

Unfortunately, the online documentation regarding folder structure in releases does not match the current release, so it is a little confusing trying to work out exactly what the baseline is regarding referencing the various parts.

Forgetting jQuery and DataViz / Mobile, what are the minimum references I need to place in my file / directory to obtain complete functionality of Kendo UI Complete for MVC?

Is it this?

js/kendo.aspnetmvc.min.js
js/kendo.web.min.js
styles/kendo.default.min.css
styles/images/*
styles/Default/*

Is js/kendo.all.min.js required? Do I need anything else or are are the above assets enough?

Many thanks.

Richard

General Discussions

answered on 19 Jul 2012

1 answer

494 views

No parameterless constructor defined for this object

Hi

We are getting the error "No parameterless constructor defined for this object" when we try to bind collection to the Kendo grid and obviously the business objects that we have in our business layer has private constructors and it worked fine with Telerik.

Here is the stack trace of the error

Line 171:    {

Line 172:        //@(Html.Kendo().Grid<City.Australia.Framework.BL.UserInfo>()

Line 173:        @(Html.Kendo().Grid(Model.Users)

Line 174:            .Name("UserGrid")

Line 175:            .EnableCustomBinding(true)

Source File: d:\Development\City.Australia.Admin\City.Australia.Admin\Views\User\Search.cshtml Line: 173

Stack Trace:

[MissingMethodException: No parameterless constructor defined for this object.]

   System.RuntimeTypeHandle.CreateInstance(RuntimeType type, Boolean publicOnly, Boolean noCheck, Boolean& canBeCached, RuntimeMethodHandleInternal& ctor, Boolean& bNeedSecurityCheck) +0

   System.RuntimeType.CreateInstanceSlow(Boolean publicOnly, Boolean skipCheckThis, Boolean fillCache) +98

   System.RuntimeType.CreateInstanceDefaultCtor(Boolean publicOnly, Boolean skipVisibilityChecks, Boolean skipCheckThis, Boolean fillCache) +241

   System.Activator.CreateInstance(Type type, Boolean nonPublic) +69

   Kendo.Mvc.UI.ModelDescriptor.CreateDataItem(Type modelType) +131

   Kendo.Mvc.UI.ModelDescriptor..ctor(Type modelType) +40

   Kendo.Mvc.UI.DataSource.ModelType(Type modelType) +31

   Kendo.Mvc.UI.Grid`1..ctor(ViewContext viewContext, IJavaScriptInitializer initializer, IUrlGenerator urlGenerator, IGridHtmlBuilderFactory htmlBuilderFactory) +822

   Kendo.Mvc.UI.Fluent.WidgetFactory.Grid() +114

   Kendo.Mvc.UI.Fluent.WidgetFactory.Grid(IEnumerable`1 dataSource) +55

   ASP._Page_Views_User_Search_cshtml.Execute() in d:\Development\City.Australia.Admin\City.Australia.Admin\Views\User\Search.cshtml:173

   System.Web.WebPages.WebPageBase.ExecutePageHierarchy() +207

   System.Web.Mvc.WebViewPage.ExecutePageHierarchy() +81

   System.Web.WebPages.StartPage.RunPage() +19

   System.Web.WebPages.StartPage.ExecutePageHierarchy() +65

   System.Web.WebPages.WebPageBase.ExecutePageHierarchy(WebPageContext pageContext, TextWriter writer, WebPageRenderingBase startPage) +76

   System.Web.Mvc.RazorView.RenderView(ViewContext viewContext, TextWriter writer, Object instance) +220

   System.Web.Mvc.BuildManagerCompiledView.Render(ViewContext viewContext, TextWriter writer) +115

   System.Web.Mvc.ViewResultBase.ExecuteResult(ControllerContext context) +303

   System.Web.Mvc.ControllerActionInvoker.InvokeActionResult(ControllerContext controllerContext, ActionResult actionResult) +13

   System.Web.Mvc.<>c__DisplayClass1c.<InvokeActionResultWithFilters>b__19() +23

   System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilter(IResultFilter filter, ResultExecutingContext preContext, Func`1 continuation) +260

   System.Web.Mvc.<>c__DisplayClass1e.<InvokeActionResultWithFilters>b__1b() +19

   System.Web.Mvc.ControllerActionInvoker.InvokeActionResultWithFilters(ControllerContext controllerContext, IList`1 filters, ActionResult actionResult) +177

   System.Web.Mvc.ControllerActionInvoker.InvokeAction(ControllerContext controllerContext, String actionName) +343

   System.Web.Mvc.Controller.ExecuteCore() +116

   System.Web.Mvc.ControllerBase.Execute(RequestContext requestContext) +97

   System.Web.Mvc.ControllerBase.System.Web.Mvc.IController.Execute(RequestContext requestContext) +10

   System.Web.Mvc.<>c__DisplayClassb.<BeginProcessRequest>b__5() +37

   System.Web.Mvc.Async.<>c__DisplayClass1.<MakeVoidDelegate>b__0() +21

   System.Web.Mvc.Async.<>c__DisplayClass8`1.<BeginSynchronous>b__7(IAsyncResult _) +12

   System.Web.Mvc.Async.WrappedAsyncResult`1.End() +62

   System.Web.Mvc.<>c__DisplayClasse.<EndProcessRequest>b__d() +50

   System.Web.Mvc.SecurityUtil.<GetCallInAppTrustThunk>b__0(Action f) +7

   System.Web.Mvc.SecurityUtil.ProcessInApplicationTrust(Action action) +22

   System.Web.Mvc.MvcHandler.EndProcessRequest(IAsyncResult asyncResult) +60

   System.Web.Mvc.MvcHandler.System.Web.IHttpAsyncHandler.EndProcessRequest(IAsyncResult result) +9

   System.Web.CallHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute() +8969117

   System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously) +184

Thanks
Rasika Perera

Grid

answered on 18 Jul 2012

2 answers

61 views

Support

The support on the Telerik MVC side has been outstanding. On the Kendo side, not so much. Forum posts just sit around without comment for days or months, this never happened on the Telerik side. If you are going to phase out the Telerik MVC controls, you need to monitor and pay closer attention to the forums here making sure that you are responding to people in a timely manner. Especially when the documentation is sparse.

Thanks!

General Discussions

answered on 18 Jul 2012

6 answers

1.1K+ views

[Solved] Cannot get value of selected item in treeview

with the old telerik MVC extensions, i could do the following:

@(Html.Telerik().TreeView().Name("TreeView").HtmlAttributes(new { style = "white-space:normal;width:250px;" }).ClientEvents(events => events

.OnLoad("onLoad")

.OnSelect("onSelect")

)

.BindTo(Model.RootNode.ChildNodes, mappings =>

{

mappings.For<DocReaderNode>(binding => binding

.ItemDataBound((item, nd) =>

{

item.Text = nd.DocTitle;

item.Value = nd.DocUrl;

})

.Children(nd => nd.ChildNodes));

})

)

then i could use the following javascript to get the node value when a node is selected:

function onSelect(e) {

var t = $('#TreeView').data('kendoTreeView');

var selVal = t.getItemValue(e.item) ;

}

Now with Kendo, i don't see how to get the value of the selected node any longer. Any tips?

TreeView

answered on 18 Jul 2012

0 answers

218 views

Help populate second grid by selection in first grid

Hi,

I am trying to create a permissions view for my MVC 4 application.

What I want to achieve is that the selection made on the users table, populates the payrolls this person can access in a second table, then by selecting a payroll from the second table I would like it to display the permissions that user has within the selected payroll. So exactly like this http://demos.telerik.com/aspnet-ajax/grid/examples/clientmasterdetails/defaultcs.aspx but three tables instead of 2.

I can get a grid to populate with the users but where I am strugling is getting the selected user to query the payrolls and populate the payrolls table. I am quite new to all this so I am not quite sure how the selection gets the data and renders the grid? Does this call an ajax action in the view controller? And how is the second grid element then rendered? Does it re-render the first grid with the list of users again or will this persits?

My controller so far is like this NB the ReadPay and ReadPay Functions and all the ViewData in the Index action are my attempts to get this to work so please ignore them if they are wrong and point me in the right direction if possible please:

using System;

using System.Collections.Generic;

using System.Data;

using System.Data.Entity;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using PayPlate.Models;

using PayPlate.DAL;

using PagedList;

namespace PayPlate.Controllers

{

public class UserController : Controller

{

UnitOfWork unitOfWork = new UnitOfWork();

public ActionResult Index(Int32 ? uid, Int32 ? pid)

{

ViewData["Users"] = Read();

if (uid == null)

{

uid = unitOfWork.UserRepository.Get().FirstOrDefault().UserID;

}

ViewData["uid"] = uid;

ViewData["Payrolls"] = ReadPay(uid.Value);

if (pid == null)

{

pid = unitOfWork.UserRepository.Get(i => i.UserID == uid).Single().Permissions.Select(p => p.PayrollID).Distinct().FirstOrDefault();

}

ViewData["pid"] = pid;

ViewData["Permissions"] = ReadPerm(uid.Value, pid.Value);

return View();

}

public IEnumerable<Payroll> ReadPay(Int32 uid)

{

var pays = unitOfWork.UserRepository.Get(i => i.UserID == uid).Single().Permissions.Select(p => p.Payroll).Distinct();

// Use a view model to avoid serializing internal Entity Framework properties as JSON

pays = pays.Select(p => new Payroll

{

PayrollID = p.PayrollID,

Title = p.Title,

C21Name = p.C21Name,

Server = p.Server,

Port = p.Port,

Connection = p.Connection

})

.ToList();

return pays;

}

public IEnumerable<Permission> ReadPerm(Int32 uid, Int32 pid)

{

var viewModel = new PayrollIndexData();

var selectedPay = viewModel.Payrolls.Where(x => x.PayrollID == pid).Single();

var usersPay = selectedPay.Permissions.Where(u => u.UserID == uid);

viewModel.Permissions = usersPay;

var perms = viewModel.Permissions;

return perms;

}

/// <summary>

/// Creates new products by inserting the data posted by the Kendo Grid in the database.

/// </summary>

/// <param name="products">The products created by the user.</param>

/// <returns>The inserted products so the Kendo Grid is aware of the database generated ProductID</returns>

[HttpPost]

public ActionResult Create(IEnumerable<User> _users)

{

var result = new List<User>();

//Iterate all created products which are posted by the Kendo Grid

foreach (var user in _users)

{

// Create a new Product entity and set its properties from productViewModel

var _user = new User

{

NetLogin = user.NetLogin,

EmpNumber = user.EmpNumber,

Forename = user.Forename,

Surname = user.Surname,

Active = user.Active

};

// store the product in the result

result.Add(_user);

// Add the entity

unitOfWork.UserRepository.Insert(_user);

}

// Insert all created products to the database

unitOfWork.Save();

// Return the inserted products - the Kendo Grid needs their ProductID which is generated by SQL server during insertion

return Json(result.Select(p => new User

{

UserID = p.UserID,

NetLogin = p.NetLogin,

EmpNumber = p.EmpNumber,

Forename = p.Forename,

Surname = p.Surname,

Active = p.Active

})

.ToList());

}

/// <summary>

/// Reads the available products to provide data for the Kendo Grid

/// </summary>

/// <returns>All available products as JSON</returns>

[HttpPost]

public ActionResult Read()

{

var _users = unitOfWork.UserRepository.Get()

// Use a view model to avoid serializing internal Entity Framework properties as JSON

.Select(p => new User

{

UserID = p.UserID,

NetLogin = p.NetLogin,

EmpNumber = p.EmpNumber,

Forename = p.Forename,

Surname = p.Surname,

Active = p.Active

})

.ToList();

return Json(_users);

}

/// <summary>

/// Updates existing products by updating the database with the data posted by the Kendo Grid.

/// </summary>

/// <param name="products">The products updated by the user</param>

[HttpPost]

public ActionResult Update(IEnumerable<User> _users)

{

//Iterate all created products which are posted by the Kendo Grid

foreach (var user in _users)

{

// Attach the entity

unitOfWork.UserRepository.Update(user);

}

// Save all updated products to the database

unitOfWork.Save();

//Return emtpy result

return Json(null);

}

/// <summary>

/// Destroys existing products by deleting them from the database.

/// </summary>

/// <param name="products">The products deleted by the user</param>

[HttpPost]

public ActionResult Destroy(IEnumerable<User> _users)

{

//Iterate all destroyed products which are posted by the Kendo Grid

foreach (var user in _users)

{

// Delete the entity

unitOfWork.UserRepository.Delete(user);

}

// Delete the products from the database

unitOfWork.Save();

//Return emtpy result

return Json(null);

}

//

// GET: /User/Details/5

public ViewResult Details(Int32? id, Int32? payrollID, IEnumerable<User> _users)

{

var viewModel = new PayrollIndexData();

foreach (var _user in _users)

{

viewModel.Users = unitOfWork.UserRepository.Get(i => i.UserID == _user.UserID);

}

if (id != null)

{

ViewBag.UserID = id.Value;

viewModel.Payrolls = unitOfWork.UserRepository.Get(i => i.UserID == id.Value).Single().Permissions.Select(p => p.Payroll).Distinct();

}

if (payrollID != null)

{

ViewBag.PayrollID = payrollID.Value;

var selectedPayroll = viewModel.Payrolls.Where(x => x.PayrollID == payrollID).Single();

var usersPayroll = selectedPayroll.Permissions.Where(u => u.UserID == id.Value);

viewModel.Permissions = usersPayroll;

}

return View(viewModel);

}

protected override void Dispose(bool disposing)

{

unitOfWork.Dispose();

base.Dispose(disposing);

}

This is my view so far, again the second grid code and the selectable: true in the first grid are my attempts to get this to work:

@section CustomHeader {

@* kendo.common.min.css contains common CSS rules used by all Kendo themes *@

<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css" rel="stylesheet" />

@* kendo.silver.min.css contains the "Blue Opal" Kendo theme *@

<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.silver.min.css" rel="stylesheet" />

<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>

}

<h2>Users</h2>

@* The DIV where the Kendo grid will be initialized *@

<div id="grid"></div>

<script>

$(function () {

$("#grid").kendoGrid({

height: 425,

selectable: "true",

columns: [

{ field: "NetLogin", width: "60px" },

{ field: "EmpNumber", width: "60px" },

{ field: "Forename", width: "90px" },

{ field: "Surname", width: "90px" },

{ field: "Active", width: "45px" },

{ command: "destroy", title: "Command", width: "120px", groupable: false, filterable: false }

],

change: function() {

var row = this.select();

var id = row.data("id");

$("#log").html("selected row with id= " + id);

var secondGrid = $("#grid2").data("kendoGrid");

var row = secondGrid.table.find('tr[data-id="' + id + '"]');

secondGrid.select(row);

},

editable: true, // enable editing

sortable: true,

pageable: true,

filterable: true,

groupable: true,

resizable: true,

reorderable: true,

toolbar: ["create", "save", "cancel"], // specify toolbar commands

dataSource: {

pageSize: 20,

schema: {

model: { // define the model of the data source. Required for validation and property types.

id: "UserID",

fields: {

UserID: { editable: false, nullable: true },

NetLogin: { validation: { required: true } },

EmpNumber: { validation: { required: true } },

Forename: { validation: { required: true } },

Surname: { validation: { required: true } },

Active: { validation: { required: false } }

}

},

batch: true, // enable batch editing - changes will be saved when the user clicks the "Save changes" button

transport: {

create: {

url: "@Url.Action("Create", "User")", //specify the URL which should create new records. This is the Create method of the HomeController.

type: "POST" //use HTTP POST request as the default GET is not allowed for ASMX

},

read: {

url: "@Url.Action("Read", "User")", //specify the URL which should return the records. This is the Read method of the HomeController.

type: "POST" //use HTTP POST request as by default GET is not allowed by ASP.NET MVC

},

update: {

url:"@Url.Action("Update", "User")", //specify the URL which should update the records. This is the Update method of the HomeController.

type: "POST" //use HTTP POST request as by default GET is not allowed by ASP.NET MVC

},

destroy: {

url: "@Url.Action("Destroy", "User")", //specify the URL which should destroy the records. This is the Destroy method of the HomeController.

type: "POST" //use HTTP POST request as by default GET is not allowed by ASP.NET MVC

},

parameterMap: function(data, operation) {

if (operation != "read") {

// post the products so the ASP.NET DefaultModelBinder will understand them:

// _users[0].Value="value"

// _users[0].UserID =1

// _users[1].Value="value"

// _users[1].UserID =1

var result = {};

for (var i = 0; i < data.models.length; i++) {

var _user = data.models[i];

for (var member in _user) {

result["_users[" + i + "]." + member] = _user[member];

}

return result;

}

});

</script>

<h2>Payrolls</h2>

@* The DIV where the Kendo grid will be initialized *@

<div id="grid2"></div>

<script>

$(function () {

$("#grid2").kendoGrid({

height: 425,

columns: [

{ field: "PayrollID", width: "45px" },

{ field: "Title", width: "100px" },

{ field: "C21Name", width: "70px" },

{ field: "Server", width: "70px" },

{ field: "Port", width: "30px" },

{ field: "Connection", width: "130px" }

],

sortable: true,

pageable: true,

filterable: true,

groupable: true,

resizable: true,

reorderable: true,

dataSource: {

pageSize: 20,

schema: {

model: { // define the model of the data source. Required for validation and property types.

id: "PayrollID",

fields: {

PayrollID: { editable: false, nullable: true },

Title: { validation: { required: true} },

C21Name: { validation: { required: true} },

Server: { validation: { required: true} },

Port: { validation: { required: true} },

Connection: { validation: { required: true} }

}

},

parameterMap: function (data, operation) {

if (operation != "read") {

// post the products so the ASP.NET DefaultModelBinder will understand them:

// agrps[0].Value="value"

// agrps[0].PayrollID =1

// agrps[1].Value="value"

// agrps[1].PayrollID =1

var result = {};

for (var i = 0; i < data.models.length; i++) {

var pay = data.models[i];

for (var member in pay) {

result["pays[" + i + "]." + member] = pay[member];

}

return result;

}

});

</script>

Your help will be greatly appreciated!

Andy

Grid

asked on 18 Jul 2012

0 answers

90 views

MVC Grid: Error by adding more then 2 filters by 1 column

Hi,

I have an error by using filters in grid mvc (Using Q2 2012 release):
In the beta release i had no error with the same code.
Unhandled exception at line 1, column 334352 in kendo.web.min.js
Set is undifined

i.set("value",b._parse(j.value))

My javascript code is:

$('#ListGrid').data('kendoGrid').dataSource.filter({

logic: "and",

filters:

[{