Questions on UI for ASP.NET MVC Forum

3 answers

93 views

Hello,

I've encountered a rather peculiar issue with regards to using the Edit grid action command. As illustrated through the attached images: (1.png) displays a grid with 2 entries, I click the Edit command button which leads me right to an edit popup window and I proceed to make the necessary changes (2.png); I then click the Update button and the grid displays the changes accordingly (3.png); I repeat the process of clicking the Edit command button but instead of clicking Update and changing any values, I click the 'X' button and the values revert back to how it was in (1.png) before the update was done.

A video of the recreation can be found here: bit.ly/OEvZUc
(The video is in .wmv format, I placed it in an bitmark just to keep track of the clicks so don't worry)

The process involved here is that I store the values in a List<> which I keep updated through its constant reassignment a session variable. I am currently using version 2012.2.913 and jQuery1.8.2. Thanks in advance for the help!

Grid

answered on 26 Jun 2013

1 answer

161 views

Cascading Dropdown, within TabStrip and Grid with Editor Template, popup...

I am having a problem with a cascading dropdown child list will not populate

I am trying to implement a cascading dropdown, having problems with the Javascript to get the key value from selected parent...

Here is the code:
<script>

$(document).ready(function () {
var Region = $("#Region").data("kendoDropDownList")
});

function filtercountry()
{
return {
categories: $("#categories").val()
};
</script>

<div class="editor-field">
@(Html.Kendo().DropDownList()
.Name("Country")
.DataTextField("CountryName")
.DataValueField("CountryCode")
.HtmlAttributes(new { style = "width: 250px" })
.DataSource(dataSource =>
{
dataSource.Read(read =>
{
read.Action("GetCountries", "Location").Data("filtercountry");
})
.ServerFiltering(true);
})
.Enable(false)
.AutoBind(false)
.CascadeFrom("Region")
)
</div>
I had a similar issue with Combox box and found the solution required a deeper layer of reference to control..., listed below
function DonAdditionalData()
{
var DM = $("#DManage").data("kendoComboBox");
DM2 = DM.input.val();
return
{
text:DM2
};
}

DropDownList

answered on 25 Jun 2013

14 answers

299 views

DataReader must be closed first

I'm following the 'Basic Usage' example and did the following:

@model IEnumerable<DigiBob.Model.Governance.RolesResponsibilities.RoleName>

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

.Name("Grid")

.Columns(columns =>

{

columns.Bound(p => p.Name);

})

.Pageable()

.Sortable()

.Scrollable(scr=>scr.Height(430))

.Filterable()

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.ServerOperation(false)

)

And:

RoleNameRepository _roleNameRepository = new RoleNameRepository(new DigiBobContext());

public ActionResult Index()

{

return View(_roleNameRepository.GetAll());

}

I'm getting this error:
There is already an open DataReader associated with this Command which must be closed first.There is already an open DataReader associated with this Command which must be closed first.

I added .ToList() to the last command and am now getting this error:
A circular reference was detected while serializing an object of type 'System.Data.Entity.DynamicProxies.RoleName_9130BF9423DB97238B259DFD54766A3850EC298A017442C28EED589A812C582A'

How can I get this simplest of grid examples to show the results of my query?

Grid

answered on 25 Jun 2013

2 answers

458 views

Razor syntax help in Client Detail Template for Grid

I have a grid in which I am using the client detail template and I need a little help with the syntax. I am trying to do a fairly simple conditional against an item in the parent grid data. When I start typing the syntax as I think it should be, I get "Preprocessor directives must appear as the first non-whitespace character on a line". Here is what I am typing:

Minutes Early/Late: @if(#: PODInfo.MinutesEarlyLate # > 0){ #: PODInfo.MinutesEarlyLate # Late } else { On Time }

I am fairly new to Razor, and maybe here I need Javascript instead. I have actually tried both, but it is the # syntax with which I think I am having trouble.

Thank you in advance for any help!

Donna

In case - here's the grid

@(Html.Kendo().Grid<GMCRepository.Models.DataServices.ShipmentInformation>().Name("ShipmentList")

.DataSource(dataSource => dataSource

.Ajax()

.Read(read => read.Action("ShipmentInfoList", "DataInquiry"))

)

.Columns(columns =>

{

columns.Bound(shipment => shipment.TrackingNumber);

columns.Bound(shipment => shipment.ShipDate);

columns.Bound(shipment => shipment.ShipperInformation.Address.City);

columns.Bound(shipment => shipment.ShipperInformation.Address.StateProvince);

columns.Bound(shipment => shipment.RecipientInformation.Address.City);

columns.Bound(shipment => shipment.RecipientInformation.Address.StateProvince);

columns.Bound(shipment => shipment.AmountDue);

columns.Bound(shipment => shipment.BillingInfo.BillToAccount);

columns.Bound(shipment => shipment.CustomerReference);

})

.ClientDetailTemplateId("shipmentDetail-template")

)

Here's the client detail template:

<script id="shipmentDetail-template" type="text/x-kendo-template">

<div class="shipment-grid-detail">

<div class="row-fluid">

<div class="span4 shipment-div">

<h4>Shipper Information</h4>

#: ShipperInformation.Name # <br />

#: ShipperInformation.Company # <br />

#: ShipperInformation.Address.AddressLine1 # <br />

#: ShipperInformation.Address.AddressLine2 # <br />

#: ShipperInformation.Address.City #, #: ShipperInformation.Address.State #  #: ShipperInformation.Address.PostalCode #, #: ShipperInformation.CountryCode #

</div>

<div class="span4 shipment-div">

<h4>Recipient Information</h4>

#: RecipientInformation.Name # <br />

#: RecipientInformation.Company # <br />

#: RecipientInformation.Address.AddressLine1 # <br />

#: RecipientInformation.Address.AddressLine2 # <br />

#: RecipientInformation.Address.City #, #: RecipientInformation.Address.State #  #: RecipientInformation.Address.PostalCode #, #: RecipientInformation.CountryCode #

</div>

<div class="span4 shipment-div">

<h4>Shipment Information</h4>

Ship Date: #: ShipDate # <br />

Service: #: PackageInfo.Service # <br />

Packaging: #: PackageInfo.PackageDescription # <br />

Actual Weight: #: PackageInfo.ActualWeight.Weight # #: PackageInfo.ActualWeight.WeightUnit # <br />

Billed Weight: #: PackageInfo.BilledWeight.Weight # #: PackageInfo.BilledWeight.WeightUnit # <br />

Dimensions: #: PackageInfo.dimensions.DimLength # x #: PackageInfo.dimensions.DimWidth # x #: PackageInfo.dimensions.DimHeight # #: PackageInfo.dimensions.DimUOM # <

br />

Pieces: #: PackageInfo.Pieces #

</div>

<div class="row-fluid">

<div class="span4 shipment-div">

<h4>Delivery Information</h4>

POD Date: #: PODInfo.PODDate # <br />

POD Name: #: PODInfo.PODSignature # <br />

Minutes Early/Late: @if(#: PODInfo.MinutesEarlyLate # > 0){ #: PODInfo.MinutesEarlyLate # Late } else { On Time }

</div>

<div class="span4 shipment-div">

<h4>Billing Information</h4>

Payment Option: #: BillingInfo.PaymentOption # <br />

Zone: #: BillingInfo.CarrierZone # <br />

Bill To Account: #: BillingInfo.BillToAccount # <br />

Payment File Ref: #: BillingInfo.PaymentReference # <br />

Closing Run: #: BillingInfo.PaymentRefFileName # <br />

Bundle Number: #: BillingInfo.BundleNumber #

</div>

<div class="span4 shipment-div">

<h4>Charge Information</h4>

<div class="row-fluid">

<div class="span6">

Original Amount: <br />

Credits: <br />

Refunds: <br />

Amount Due:

</div>

<div class="span6">

#: OriginalAmount # <br />

#: Credits # <br />

#: Refunds # <br />

#: AmountDue #

</div>

<div class="row-fluid">

@(Html.Kendo().Grid<GMCRepository.Models.DataServices.ChargesInformation>().Name("ShipmentCharges")

.DataSource(dataSource => dataSource.Ajax().Read(read => read.Action("ChargesList", "DataInquiry"))

)

.Columns(columns =>

{

columns.Bound(charge => charge.ChargeDescription);

columns.Bound(charge => charge.ChargeAmount);

})

.ToClientTemplate())

</div>

<div class="row-fluid">

<div class="span4 shipment-div">

<h4>Cost Center Information</h4>

Cost Center: #: BillingInfo.CostCenter # <br />

Match Type: #: BillingInfo.CostCenterMatchType # <br />

</div>

<div class="span4 shipment-div">

<h4>References</h4>

</div>

</script>

Grid

answered on 24 Jun 2013

5 answers

241 views

Upgrade Wizard fails to update dll

Trying to update to the 2013.1.319 version of Kendo.Mvc.dll but it gives a warning. It says that the most common cause is that there's a conflict of the local and GAC versions. I don't have it in the GAC.

Just need a way to get the most recent dll file. Which, according to this post below, is the way to toggle the readonly property of a Kendo dropdown.

http://www.kendoui.com/forums/mvc/dropdownlist/dropdownlist-readonly()-not-recognized.aspx

Installer and VS Extensions

answered on 24 Jun 2013

7 answers

469 views

TabStrip focus using keyboad navigation

If I open the demo at http://demos.kendoui.com/web/tabstrip/index.html and hit Tab to navigate using the keybard, I can see a blue margin highlighting that the TabStrip has focus.

If I open the theme editor with the default theme, there is no indication that the TabStrip has focus. How can I get my TabStrib to provide feedback to the user that it has focus as the demo page does?

Thank you

TabStrip

answered on 24 Jun 2013

2 answers

406 views

AntiForgeryToken gets lost in editing custom editor

Hi!

I'm new to MVC4 and thus built some little demo including a Kendo UI Grid and a partial view which serves as a custom editor. Everything works perfect except that the AntiForgeryToken gets lost on the way.

This is my definition of the grid:

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

.Name("grdProducts")

.Columns(columns =>

{

columns.Bound(p => p.Name);

columns.Bound(p => p.ProductType);

columns.Bound(p => p.SellStartDate);

columns.Bound(p => p.SellEndDate);

columns.Command(command => command.Edit()).Width(160);

})

.ToolBar(toolbar => toolbar.Create())

.Editable(editable => editable

.Mode(GridEditMode.PopUp)

.DisplayDeleteConfirmation(true)

.TemplateName("ProductEditor")

.Window(w => w

.Width(700)

.Title("Edit Product")))

.Pageable(pa => pa.Numeric(false).PageSizes(new [] {5,10,20}))

.Scrollable(scr => scr.Height(430).Virtual(false))

.Selectable(selectable => selectable.Mode(GridSelectionMode.Single))

.DataSource(dataSource => dataSource

.Ajax()

.AutoSync(false)

.Batch(false)

.PageSize(20)

.ServerOperation(false)

.Model(model =>

{

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

model.Field(p => p.Id).Editable(false);

model.Field(p => p.CategoryName).Editable(false);

model.Field(p => p.ProductType).DefaultValue((int)ProductTypeEnum.Cameras);

})

.Create(create => create.Action("EditingCreate", "Product"))

.Read(read => read.Action("EditingRead", "Product"))

.Update(update => update.Action("EditingUpdate", "Product"))

)

And this is the start of my partial view named "ProductEditor.cshtml" saved in subdir "EditorTemplates":

@model _ProductStore.Infrastructure.Models.Products.Product



@{

    ViewBag.Title = "Edit";

}



@using (Html.BeginForm())

{

@Html.AntiForgeryToken()

@Html.ValidationSummary(true)

<fieldset>

... all labels and fields...

</fieldset>

}

The popup opens as it should and everything works fine except that the hidden input for AntiForgeryToken looks like this:

<input name="__RequestVerificationToken" type="hidden" data-bind="value:__RequestVerificationToken" value=""/>

In other words: the value is empty. Placing the AntiForgeryToken helper somewhere else in my views it is working perfectly.

What am I doing wrong?

Regards
Neils

Grid

answered on 24 Jun 2013

1 answer

157 views

Keno control difference between HTML and Asp.net MVC

Hi,
In below url you have two example HTML and Asp.net MVC.

http://demos.kendoui.com/web/autocomplete/index.html

Can you tell me what is difference between this two.(HTML and Asp.net MVC)

Thank you
Amitkumar

General Discussions

answered on 24 Jun 2013

3 answers

2.1K+ views

newbie .kendoDatePicker is not a function

hi,

I test kendoui MVC razor, follow this way my test project

_Layout.cshtml

<script src="@Url.Content("~/Scripts/kendo/jquery.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/kendo.web.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/kendo.aspnetmvc.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/console.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/prettify.min.js")"></script>

index.cshtml

@(Html.Kendo().DatePicker().Name("Birthday"))

But have error on javascript

TypeError: jQuery(...).kendoDatePicker is not a function

General Discussions

answered on 21 Jun 2013

1 answer

568 views

"Realtime" data updates in grid?

I have a Grid-component that is populated by a call to a service, from an action in my controller. I was wondering if it is possible to do this continuously, so that it will update the grid with real-time data?

Right now, my view looks like this;

@model FleetMonitorModel

<div class="span12">

<legend>Fleet Monitor</legend>

<div>

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

.Name("Grid")

.DataSource(ds => ds

.Ajax()

.Read(read => read.Action("Get", "FleetMonitor"))

)

.HtmlAttributes(new { style = "height:auto;" })

.AutoBind(true)

.Columns(columns =>

{

columns.Template(p => { }).ClientTemplate(" ").Width(310);

columns.Template(p => { }).ClientTemplate(" ").Width(250);

columns.Template(p => { }).ClientTemplate(" ").Width(150);

columns.Template(p => { }).ClientTemplate(" ");

columns.Template(p => { }).ClientTemplate(" ").Width(80);

})

.ClientRowTemplate(Html.Partial("_ClientRowTemplate", Model).ToHtmlString())

.Pageable()

.Sortable())

</div>

And my controller like this:

private FleetMonitorModel Model { get; set; }

...

public ActionResult Get([DataSourceRequest] DataSourceRequest request)

{

UnitContract[] listOfUnitsFromService = Client.GetListOfUnits(true);

Model = new FleetMonitorModel()

{

UnitDetails = GenerateUnitDetails(listOfUnitsFromService.ToList()),

Refresh = true

};

return Json(Model.UnitDetails.ToDataSourceResult(request));

}

Basically, the service will provide a steady stream of updated data, causing it to be more or less real-time.. All I want to accomplish, is to refresh the grid with my new data and update the graphical elements of my template. Current template is working fine, but data is only refreshed when page is refreshed.

Grid

answered on 21 Jun 2013