Questions on UI for ASP.NET MVC Forum

1 answer

79 views

I updated to kendo 19.x today and got a load of errors, I did a rollback and all ok.
Is kendo supposed to work with 19.x, if not will there be an update soon?
Thanks

General Discussions

answered on 31 Jan 2013

2 answers

122 views

Enable properties by true/false

Hi,
It would be great if you could build in so some common properties are possible to enable by parameter true/false.
You have this functionality on some properties already.
It would be useful for example Create, Edit, Destroy like:

.ToolBar(commands => commands.Create(false))

It is then possible to grab this from the model like:

.ToolBar(commands => commands.Create(Model.EnableCreate))

Regards,
Mattias

Grid

answered on 31 Jan 2013

2 answers

146 views

get current mode of grid

Is there a way to get the current mode of the grid inside a column template? I want to check if the grid is in edit mode within a column template so I can act on it.

Grid

answered on 30 Jan 2013

3 answers

364 views

EnableCustomBinding problems with sort and filter

I have some grids using telerik MVC controls that I am trying to move to Kendo.
They handle large amounts of data so I want to use custom binding.

so far I have got the grid to load with data, but when trying to sort or filter I get sorts or filter is null.
Where am I going wrong,

Thanks

My grid

@code

Dim grid As Kendo.Mvc.UI.Grid(Of BO.Models.Location) = Html.Kendo.Grid(Of BO.Models.Location)(Model.Locations) _

.Name("LocationGrid") _

.EnableCustomBinding(True) _

.Columns(Sub(c)

c.Bound(Function(b) b.ZipCode)

c.ForeignKey(Function(f) f.StateId, Model.States.AsEnumerable, "Id", "Name")

c.Bound(Function(b) b.City)

c.Bound(Function(b) b.Longitude)

c.Bound(Function(b) b.Latitude)

'c.Command(Sub(m)

' m.Edit()

'                  'm.Custom("Details").Text("Details").Action("details", "location", New With {.area = "admin"})

' End Sub).Width(210)

End Sub) _

.DataSource(Function(d) _

d.Ajax.Read("GetLocations", "Location", New With {.area = "admin"}).Update("UpdateLocation", "Location", New With {.area = "admin"}) _

.ServerOperation(True).Model(Sub(model) model.Id(Function(p) p.LocationId)).Total(Model.RecordCount)).Sortable().Filterable().Pageable()

grid.Render()

End Code

Controller

Function Index() As ActionResult

Return View(New BO.Models.LocationGridModel)

End Function

Function GetLocations(<Kendo.Mvc.UI.DataSourceRequestAttribute(Prefix:="Grid")> request As Kendo.Mvc.UI.DataSourceRequest) As JsonResult

If request.PageSize.Equals(0) Then

request.PageSize = 10

End If

Dim LocationGridModel As BO.Models.LocationGridModel = New BO.Models.LocationGridModel(request)

Return Json(LocationGridModel.Locations.ToList)

End Function

<HttpPost>

Function UpdateLocation(id As Integer, collection As FormCollection, <Kendo.Mvc.UI.DataSourceRequestAttribute(Prefix:="Grid")> request As Kendo.Mvc.UI.DataSourceRequest) As JsonResult

Dim Location As EF.Location = db.Locations.Find(id)

Try

UpdateModel(Location)

db.SaveChanges()

Catch ex As Exception

Throw

End Try

Dim LocationGridModel As BO.Models.LocationGridModel = New BO.Models.LocationGridModel(request)

Return Json(LocationGridModel.Locations.ToList)

End Function

LocationGridModel

Imports System.Collections.ObjectModel

Imports System.ComponentModel

Imports Kendo.Mvc

Namespace Models

Public Class LocationGridModel

Public Property PageSize As Integer = 15

Private _Locations As ReadOnlyCollection(Of BO.Models.Location)

Public ReadOnly Property Locations As ReadOnlyCollection(Of BO.Models.Location)

Get

Return _Locations

End Get

End Property

Public Property States As ReadOnlyCollection(Of BO.Models.StateDropDown)

Public Property RecordCount As Integer

Sub New()

Using db As EF.HomelyEntities = New EF.HomelyEntities

Me._Locations = ConvertToDbMoldelsLocation(db.Locations.OrderBy(Function(o) o.LocationId).Take(Me.PageSize))

Me.RecordCount = db.Locations.Count

Me.States = New ReadOnlyCollection(Of BO.Models.StateDropDown)(db.States.Where(Function(w) w.CountryId.Equals(2)).OrderBy(Function(o) o.Name).Select(Function(s) New BO.Models.StateDropDown With {.Id = s.StateId, .Name = s.Name}).ToList)

End Using

End Sub

Sub New(request As UI.DataSourceRequest)

Using db As EF.HomelyEntities = New EF.HomelyEntities

Me._Locations = GetData(request, Me.RecordCount)

Me.States = New ReadOnlyCollection(Of BO.Models.StateDropDown)(db.States.Where(Function(w) w.CountryId.Equals(2)).OrderBy(Function(o) o.Name).Select(Function(s) New BO.Models.StateDropDown With {.Id = s.StateId, .Name = s.Name}).ToList)

End Using

End Sub

''' <summary>

''' Reterns location data for kendo grid

''' </summary>

''' <param name="request">Kendo.Mvc.UI.DataSourceRequest</param>

''' <param name="recordCount">Integer</param>

''' <returns>ReadOnlyCollection(Of BO.Models.Location)</returns>

''' <remarks></remarks>

Private Function GetData(ByVal request As Kendo.Mvc.UI.DataSourceRequest, ByRef recordCount As Integer) As ReadOnlyCollection(Of BO.Models.Location)

Using db As EF.HomelyEntities = New EF.HomelyEntities

'todo remove recordcount

Dim data As IQueryable(Of EF.Location) = db.Locations

If request.Sorts.Any Then

For Each sortDescriptor As SortDescriptor In request.Sorts

data = SortLocation(sortDescriptor, data)

Next

Else

data = data.OrderBy(Function(o) o.LocationId)

End If

If request.Filters.Any() Then

data = data.Where(ExpressionBuilder.Expression(Of EF.Location)(request.Filters))

End If

recordCount = data.Count

If request.PageSize > 0 Then

data = data.Skip((request.Page - 1) * request.PageSize)

data = data.Take(request.PageSize)

End If

Return ConvertToDbMoldelsLocation(data)

End Using

End Function

Private Function SortLocation(sortDescriptor As SortDescriptor, data As IQueryable(Of EF.Location)) As IQueryable(Of EF.Location)

If sortDescriptor.SortDirection.Equals(ListSortDirection.Ascending) Then

Select Case sortDescriptor.Member

Case "LocationId"

data = data.OrderBy(Function(o) o.LocationId)

Case "ZipCode"

data = data.OrderBy(Function(o) o.ZipCode)

Case "StateId"

data = data.OrderBy(Function(o) o.StateId)

Case "Latitude"

data = data.OrderBy(Function(o) o.Latitude)

Case "Longitude"

data = data.OrderBy(Function(o) o.Longitude)

Case "City"

data = data.OrderBy(Function(o) o.City)

End Select

Else

Select Case sortDescriptor.Member

Case "LocationId"

data = data.OrderByDescending(Function(o) o.LocationId)

Case "ZipCode"

data = data.OrderByDescending(Function(o) o.ZipCode)

Case "StateId"

data = data.OrderByDescending(Function(o) o.StateId)

Case "Latitude"

data = data.OrderByDescending(Function(o) o.Latitude)

Case "Longitude"

data = data.OrderByDescending(Function(o) o.Longitude)

Case "City"

data = data.OrderByDescending(Function(o) o.City)

End Select

End If

Return data

End Function

''' <summary>

''' Converts to poco model to use in grid

''' </summary>

''' <param name="data">IQueryable(Of EF.Location)</param>

''' <returns>ReadOnlyCollection(Of BO.Models.Location)</returns>

''' <remarks></remarks>

Private Shared Function ConvertToDbMoldelsLocation(data As IQueryable(Of EF.Location)) As ReadOnlyCollection(Of BO.Models.Location)

Return New ReadOnlyCollection(Of BO.Models.Location)(data.Select(Function(s) New BO.Models.Location With {

.ZipCode = s.ZipCode,

.StateId = s.StateId,

.City = s.City,

.Longitude = s.Longitude,

.Latitude = s.Latitude,

.LocationId = s.LocationId

}).ToList)

End Function

End Class

End Namespace

Grid

answered on 30 Jan 2013

1 answer

482 views

MVC Model Binding with Filters

I have some comboboxes that cascade from one to the other. I would also like to be able to filter based on partial text entered into the combobox. This isn't working out of the box, so I'm working on coding it server-side. It appears that the text is being posted to the servers, but I can't find a server-side object to bind to the post. Here's what's being posted. In my case "Value" is the value of the parent combobox this combobox is cascading from.

filter[logic]:

and
filter[filters][0][field]:

Value
filter[filters][0][operator]:

eq
filter[filters][0][value]:

2
filter[filters][1][value]:

purity
filter[filters][1][field]:

Text
filter[filters][1][operator]:

contains
filter[filters][1][ignoreCase]:

true

I took a look at IFilterDescriptor, FilterDescriptor, and CompositeFilterDescriptor. They seem to have similar fields to those shown above, but they aren't binding when I try to use them as input to my Action method. I haven't had any luck finding a similar thread or any documentation around this.

Again, my end goal is to have cascading comboboxes without losing the ability to filter by text entered, so if there's any advise there, I'm all ears. Also, any advice on how to bind the posted filter info is welcome.
Thanks,
--Evan

Also, here's the definition of my comboboxes as a side note:
<tr>
<td class="formTableLabel">Price Publisher: </td>
<td>
@(Html.Kendo().ComboBox()
.Name("PricePublisherId")
.DataValueField("Value")
.DataTextField("Text")
.BindTo(Model.ReferenceData.PricePublisherList)
.Filter(FilterType.Contains)
.HtmlAttributes(new { required = "required", validationMessage = "Please select an option." }))
</td>
</tr>
<tr>
<td class="formTableLabel">Price Instrument: </td>
<td>
@(Html.Kendo().ComboBox()
.Name("PriceInstrumentId")
.DataValueField("Value")
.DataTextField("Text")
.Placeholder("(Empty)")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetPriceInstrumentList", "TradeEntry").Data("priceInstrumentListJSON").Type(HttpVerbs.Post);
})
.ServerFiltering(true);
})
.Enable(false)
.AutoBind(false)
.CascadeFrom("PricePublisherId")
.Filter(FilterType.Contains)
.HtmlAttributes(new { required = "required", validationMessage = "Please select an option." }))
</td>
</tr>

General Discussions

answered on 30 Jan 2013

2 answers

220 views

[Solved] Inserted Item Moves To Top After Save Or Another Add

I have a question about Kendo Grid for ASP.NET MVC. It's probably something that I'm not doing incorrectly.

When I add a new item to the grid, I'm using the solution described on this forum post to move the inserted <tr> to the bottom of the grid. That part works fine. However, when I save the changes to the grid or add a new item, the inserted item is moved to the top of the grid, even if that breaks the currently applied sort order.

I have attached a simple project that demonstrates this. To repro what I'm talking about, do the following:

Run the app
Note that the grid is currently sorting on the Id column in ascending order
Go to the last page
Click the "Add New Item"
Set the Id to 550 and enter First Name, Last Name, and Position
Click "Save Changes" or "Add New Item"
The inserted row that was at the bottom of the grid has been moved to the top, ignoring the sort order

Can anyone point out what I'm doing wrong?

Thanks

Grid

answered on 30 Jan 2013

3 answers

102 views

Table with One Column That is the Primary ID

I am using a grid to edit a table that is one column and that column is the primary ID. Therefore, I cannot edit the column. I want to allow adds and deletes (with checks in the background). There are two problems. I do not see the Add or Delete button in line. If I use the pop-up option, I can only add but the pop-up button states that I am editing, which would be confusing to the users. How do I get the grid to add and delete properly?

This is what I have:

@(Html.Kendo().Grid<NatureOfStudyViewModel>()

.Name("NatureOfStudyGrid")

.Columns(columns =>

{

columns.Bound(item => item.NatureOfStudy);

})

.DataSource(ds => ds

.Ajax()

.Model(model =>

{

model.Id(m => m.NatureOfStudy);

})

.Read(read => read.Action("NatureOfStudyDataSource", "Lists"))

.Create(create => create.Action("NatureOfStudyCreate","Lists"))

.Destroy(destroy => destroy.Action("NatureOfStudyDelete","Lists"))

.Events(events => events.Error("listValueDataSource_error"))

)

.Pageable()

.ToolBar(commands => commands.Create())

.Editable(edit => edit.Mode(GridEditMode.PopUp))

)

Grid

answered on 30 Jan 2013

1 answer

99 views

Adding grid to existing edit page is not working

I have an MVC4 app and I'm trying to evaluate the trial version of Kendo for MVC. I want to add a grid to an existing edit page for on of my views. We are using entity framework and views were made using the Razor view engine. On this edit view page the data that is editable is from a tabled called Agency. I want to add a grid to this razor view that will contain records from a tabled called Institute.

I have tried the AJAX binding example and the server binding example located here: http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/ajax-binding but neither of these seem to work in my existing application.

How do I accomplish this?

Grid

answered on 29 Jan 2013

2 answers

553 views

Can I attach event to piechart area click

Hi, I would like to show relevant expanded data in a grid when user clicks on pie chart. Does charts provide any built in client events that get raised when chart area is clicked or do I have to hook it manually in jquery.

Chart

answered on 29 Jan 2013

1 answer

182 views

DropDownList not opening with many items (~15000)

Hi,

I have a DropDownList which is populated with many items (around 15000). I know this is a lot, but it is needed for this application.

Unfortunately, the DropDownList does not open anymore, when there are that many items. The open Animation is shown but the Dropdown is closed immediately. I'm using the Version 2012.3.1114.

Is there a fix to this?

Greets

DropDownList

answered on 29 Jan 2013