Questions on UI for ASP.NET MVC Forum

2 answers

330 views

validator bug?

I can't get MVC 3 model validation to work using the Kendo validator. I get a "syntax error, unrecognized expression" thrown from kendo.aspnet.mvc.js.

I can get it to work if I change line 432, which is the 'locate' function of the mvcLocator message locator. I added single quotes around the fieldname.

return element.find(".field-validation-valid[data-valmsg-for='" + fieldName + "'], .field-validation-error[data-valmsg-for='" + fieldName + "']");<br>

Is this a bug?

General Discussions

answered on 03 Jul 2012

1 answer

214 views

KendoUI - Uncaught ReferenceError when creating a new row.

Hi,

I get the error "Uncaught ReferenceError: Customer is not defined" when i try and create a new row on the grid. It will display the data correctly.

My grid is defined like this ...

@(Html.Kendo().Grid(Model)

.Name("OrderGrid")

.Columns(columns =>

{

columns.Bound(o => o.OrderId).Title("Order Id");

columns.Bound(o => o.Customer.CustomerName).Title("Customer Name");

columns.Bound(o => o.AccountManager).Title("AccountManager");

columns.Command(command => { command.Destroy(); command.Edit(); });

})

.Pageable()

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

.ToolBar(commands => commands.Create().Text("New Order"))

.Filterable()

.DataSource(dataSource => dataSource

.Ajax()

.Model(model => model.Id(o => o.OrderId))

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

.Create(create => create.Action("Orders_Create", "Order"))

.Read(read => read.Action("Orders_Read", "Order"))

.Update(update => update.Action("Orders_Update", "Order"))

.Destroy(destroy => destroy.Action("Orders_Destroy", "Order"))

)

And my models are like this...

public class Order

{

public int OrderId { get; set; }

public int CustomerId { get; set; }

public string AccountManager { get; set; }

public Customer Customer { get; set; }

}

public class Customer

{

public int CustomerId { get; set; }

[Required]

public string CustomerName { get; set; }

[Required]

public string Address1 { get; set; }

public string Address2 { get; set; }

public string Address3 { get; set; }

public string City { get; set; }

public string County { get; set; }

[Required]

public string Postcode { get; set; }

private ICollection<Order> Orders { get; set; }

}

I guess this is because CustomerName is stored in a different table, but I can't figure out why. Any help would be great, I am so lost on this one.

Thanks,
Chris

Grid

answered on 03 Jul 2012

3 answers

617 views

Feature Request: More options for dealing with DataSourceResults

Scenario:

I have objects in the database I want to bind to a Grid. But those objects need to be converted into Models in order to avoid circular references in serialization, or to be able to have one of your Model properties equal a string representation of a child object.

A typical method of accomplishing this transformation using the Entity Framework is to materialize the query to a list, and then call materializedList.Select(c => c.ToModel()).

The problem is, it is not readily apparent how this is possible with the DataSourceRequest and DataSourceResult, because DataSourceResult.Data is not generic. And I know there is an example controller called CustomServerBinding that demonstrates this scenario, but it looks ridiculously complicated to implement for most scenarios.

I see two possibilities to handle this scenario:

Create an extension to IQueryable called ApplyGridParameters(DataSourceRequest) that would accomplish everything in ToDataSourceResult() EXCEPT for returning the DataSourceResult. Then, add an extension method for IEnumerable called ToDataSourceResult() that does not take a DataSourceRequest object. That version of the method would already assume the filters have been applied, and just load up the DataSourceResult properly.

This would allow me to write code like:
var transformedList = dbResults.ApplyGridParameters(kendoRequest).ToList().Select(c => c.ToModel());
return Json(transformedList.ToDataSourceResult());

Create an overload to IQueryable.ToDataSourceResult(DataSourceRequest) that allows me to pass in a Func to apply to the data after the query is materialized, but before it is set to the DataSourceResult.Data property. This option would be the most flexible, because you could literally do anything with it.

This would allow me to write code like:
return Json(dbResults.ToDataSourceResult(request, c => c.ToModel());

or even something like this:
var results = dbResults.ToDataSourceResult(request, c => { DoSomething(c); DoSomethingElse(c); });
return Json(results);

Obviously, this method looks a lot cleaner.

For now, I'm left with getting everything from the database, and filtering it after the fact. One of these options would allow me to pass the query back with minimal effort, and transform only the data I'm actually going to use.

Thanks!

General Discussions

answered on 02 Jul 2012

3 answers

153 views

Bug: Grouping name does not honor MVC Attributes

Given the following model:

public class PropertyUnitModel

{

public Guid Id { get; set; }

public Guid PropertyId { get; set; }

public Guid FloorPlanId { get; set; }

[Display(Name = "Floor Plan", Description = "Floor Plan", GroupName = "Floor Plan")]

public string FloorPlanName { get; set; }

public string UnitNumber { get; set; }

[Display(Name = "SqFt")]

public int SquareFootage { get; set; }

public string Notes { get; set; }

}

And the following Grid definition:

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

.Name("propertyUnitsGrid")

.Columns(columns =>

{

columns.Bound(p => p.UnitNumber).Groupable(false).Width(100);

columns.Bound(p => p.SquareFootage).Groupable(false).Width(70);

columns.Bound(p => p.Notes).Groupable(false);

})

.Sortable()

.Pageable(pager => pager.Refresh(true).PreviousNext(false).PageSizes(false).Input(false).Numeric(false))

.DataSource(dataSource => dataSource

.Ajax()

.Group(groups => groups.Add(p => p.FloorPlanName))

.Model(model => model.Id(p => p.Id))

.Read(read => read.Action("GetAllByProperty", "PropertyUnits", new { PropertyId = Model.Id }))

))

I am getting the following Grid rendering:

I do not believe this is correct. The groups should read: Floor Plan: Plan 1 [1.0BR + 1.0BA] and Floor Plan: Plan 2 [2.0BR + 1.0BA].

I don't want the actual name of the field displayed, that's why I put in the [Display] attributes, which the column rendering honors. But since the DisplayAtribute has a GroupName property, the Grid should be honoring that first, then the Name if GroupName is not present, then if neither are present, the property name.

Thanks!

Grid

answered on 02 Jul 2012

2 answers

145 views

Feature Request: More Events

Hello,

I would like to request that you guys add an event after a Grid Save ajax call completes successfully. I need to be able to synchronize the contents of two grids (when one updates, the other fetches new data) and right now there is no event I can call that isn't super chatty (meaning it also fires at times other than when the data source changes).

Preferably like a SaveCompleted event or something like that.

Thanks!

Grid

answered on 02 Jul 2012

1 answer

561 views

Using ToDataSourceResult in Web API Controller

Hi,

I'm trying to use the ToDataSourceResult inside an MVC 4 Web API controller like so (wrong, I know, please help)

public DataSourceResult Get([DataSourceRequest] DataSourceRequest request)
{
	DataSourceResult dataSourceResult;
 
	using (MobookaEntities entities = new MobookaEntities(false))
	{
		IQueryable<Campaign> campaigns = entities.Campaigns.Include("Offer")
								   .Include("Offer.Advertiser")
								   .Include("Offer.Advertiser.Company")
								   .Include("Publisher")
								   .Include("Publisher.Company")
								   .Include("Publisher.Employee")
								   .Include("Publisher.Employee.Profile")
								   .Include("Publisher.Profile")
								   .Include("Status");
 
		dataSourceResult = campaigns.ToDataSourceResult(request);

	}
return dataSourceResult;
}

But I'm getting the following error:

The ObjectContext instance has been disposed and can no longer be used for operations that require a connection.

I kind of understand why I'm getting this and if I copied the DataSourceResult object into a different object and returned that then it would work, however, I would like to know what do I need to do to have the LINQ executed and returned in my controller. Thank you!

General Discussions

answered on 02 Jul 2012

3 answers

429 views

How do I format a grid cell based on its value compared to another cell?

I want to compare a column (QtyReceived) to another column (QtyShipped) and change the background color of the QtyReceived column if it is less than QtyShipped. I need to be able to do the compare when the grid is first fired then after the user edits the QtyReceived column.

Grid

answered on 02 Jul 2012

0 answers

185 views

RangeSliderFor and RangeAttribute

Does RangeSliderFor actually work with the Range data annotation?
When I use it there is an extra value added to ModelState. Say I bind RangeSlider to a 2 item array property of type Double called "Numbers", in the controller, in ModelState I see 3 separate keys in ModelState:

Numbers[0]
Numbers[1]
Numbers

Although the slider values are valid, key 3 (Numbers) has an error against it. Why does this value appear and how do I get rid of it?

Slider

asked on 02 Jul 2012

0 answers

221 views

Date not valid on iPad

I am using a MVC DatePicker control defined as follows in my Date editor template:

Html.Kendo().DatePicker()
            .Name(ViewData.TemplateInfo.GetFullHtmlFieldName(""))
            .Min(new DateTime(2000, 1, 1))
            .Max(new DateTime(9999, 12, 31))
            .Value((DateTime)ViewData.TemplateInfo.FormattedModelValue)

It is working fine in all PC-based browsers. However, when using Safari on the iPad it works a bit differently. Firstly, when clicking the little calendar icon next to the date field calendar, no calendar pops up. Instead, when I click in the date field, the iPad "slot-machine" spinner control comes up whereby one can select a date. This is cool and I actually like that. However, no matter what date I select using this spinner control, the validation kicks in saying "Please enter a valid date". I've even tried altering the format with the .Format statement in my date picker. Whatever new format I define does apply correctly (once again, confirmed by using any pc-based browser), but still no luck in getting a valid date set in my iPad. Please help.

EDIT: In the Q2-2012 release of KendoUI, the control now displays the calendar pop up when clicking the little calendar icon next to the date field. However, this calendar popup does not respond to any touch events at all.

DatePicker