Questions on UI for ASP.NET MVC Forum

1 answer

273 views

TreeView with Remote Databinding example using Id that is a string

Hello,

I am trying to implement a TreeView using remote binding. My datasource Id property is actually a string not an integer - I am having trouble getting this working - can you advise where I am going wrong? My code is below.

Thanks,
Carrie

View

@(Html.Kendo().TreeView()

.Name("treeviewTierQueue")

.DataTextField("Text")

.DataSource(dataSource => dataSource

.Read(read => read.Action("GetTierQueueList", "Enum"))

))

Controller

public JsonResult GetTierQueueList(string level)

{

var items = new List<NestedSelectListItem>()

{

new NestedSelectListItem {Id = "0", Text = "All Analysts"},

new NestedSelectListItem {Id = "1", Text = "All Groups"},

new NestedSelectListItem {

Id = "2",

Text = "Service Desk",

hasChildren=true,

Items = new List<NestedSelectListItem> ()

{

new NestedSelectListItem {Id = "2a", Text = "2nd Level"},

new NestedSelectListItem {Id = "2b", Text = "2nd Level B"},

new NestedSelectListItem {

Id = "2c",

Text = "2nd Level C",

hasChildren= true,

Items = new List<NestedSelectListItem> ()

{

new NestedSelectListItem {Id = "3a", Text = "3rd Level"},

new NestedSelectListItem {Id = "3b", Text = "3rd Level B"}

}

} } }

};

if (!String.IsNullOrEmpty(level))

{

var filtered = items.First(i => i.Id == level).Items;

items = filtered;

}

return Json(items.AsEnumerable(), JsonRequestBehavior.AllowGet);

}

TreeView

answered on 19 Sep 2013

1 answer

114 views

Combo box doesnt call the read function each time the page is loaded in IE

in IE 8,9,10 (haven't tested anything lower) the read function only gets called once even if navigate back and then reopen the page.

My data is partners are made up of properties. so in the property edit page i have a combobox that is filled with active partners(its a bit field) i have the read saying only grab active partners to fill the combobox. the first time you enter the property edit page for property 1 it calls the read and populates the combobox with partners 1, 2, 3. Now if you navigate away from that page and mark partner 1 as not active then go back to any property edit page property 1,2,3,4,5 the combobox still shows the now inactive partner 1. in chrome this works fine and it calls read again on page load and the dropdown only has 2,3 but in ie it never calls it again unless you hit refresh on the page. and even calling datasource.read in script doesnt call the read function again.

This is an issue with ie caching things and not pulling from the server (if you open f12 developer tools in ie and select 'Cache' and then 'Always refresh from server' it works just like chrome does) but even when i turn on server filtering it never tries to repull. i have no idea how to fix this issue. I cant tell people visiting my site that they have to go into ie options and turn off caching.

ComboBox

answered on 19 Sep 2013

1 answer

258 views

ListView with editor template for foreign key type

Hello, I am having an issue where I have not been able to associate a selected item from a DropDownList to the submitted values of an editor template from my ListView.

Partial view that renders the ListView:

@(Html.Kendo().ListView<CorrectiveActionItemModel>()

.Name("corrective-action-items-listview")

.TagName("div")

.ClientTemplateId("corrective-action-item-view-template")

.DataSource(dataSource => dataSource

.Model(model =>

{

model.Id("CorrectiveActionItemID");

model.Field(f => f.CorrectiveActionPlanID).DefaultValue(this.Model.CorrectiveActionPlanID);

model.Field(f => f.CorrectiveActionItemType);

})

.PageSize(1)

.Create(create => create.Action("Item_Create", "CorrectiveActionItem", new { this.Model.CorrectiveActionPlanID }))

.Read(read => read.Action("Items_Read", "CorrectiveActionItem", new { this.Model.CorrectiveActionPlanID }))

.Update(update => update.Action("Item_Update", "CorrectiveActionItem"))

.Destroy(destroy => destroy.Action("Item_Destroy", "CorrectiveActionItem"))

)

.Pageable()

.Editable())

Editor Template for CorrectiveActionItemModel:

@using Steton.Web.MVC.Model

@model CorrectiveActionItemModel

<div class="corrective-action-item-display">

<div class="edit-buttons">

<a class="k-button k-button-icontext k-update-button" href="\\#"><span class="k-icon k-update"></span></a>

<a class="k-button k-button-icontext k-cancel-button" href="\\#"><span class="k-icon k-cancel"></span></a>

</div>

@Html.HiddenFor(m => m.CorrectiveActionItemID)

@Html.HiddenFor(m => m.CorrectiveActionPlanID)

<div class="action-section">

@Html.LabelFor(m => m.DirectiveText)

@Html.TextAreaFor(m => m.DirectiveText)

</div>

<div class="action-section">

@Html.LabelFor(m => m.ActionTakenText)

@Html.TextAreaFor(m => m.ActionTakenText)

</div>

<div class="action-section">

<div style="clear:both">

<div class="action-sub-edit-section">

<div>

@Html.LabelFor(m => m.DueDate)

@(Html.Kendo().DatePicker()

.Name("DueDate")

.Value("12/31/2013"))

</div>

<div>

@Html.LabelFor(m => m.IsCompleted)

@Html.CheckBoxFor(m => m.IsCompleted)

</div>

<div class="action-sub-edit-section">

<div>

@Html.LabelFor(m => m.CorrectiveActionItemType)

@Html.EditorFor(m => m.CorrectiveActionItemType)

</div>

Editor template for CorrectiveActionItemType:

@using System.Collections

@(Html.Kendo().DropDownList()

.Name("CorrectiveActionItemType")

.DataTextField("TypeName")

.DataValueField("CorrectiveActionItemTypeID")

.DataSource(read => read.Read("Types","CorrectiveActionItem", new { correctiveActionPlanID = "#=CorrectiveActionPlanID#" })))

Now, when the CorrectiveActionItemModel is submitted I do not get any item in the POST for CorrectiveActionItemType. I suspect that there is some binding or setup that needs to occur in order to get the DropDownList's value to be associated to the model of CorrectiveActionItemModel.

I have tried following the pattern at Editor template documentation, but I could not get the .BindTo((IEnumerable)ViewData["CorrectiveActionType"])) even though I added it the controller that renders the ListView.

Any thoughts or ideas would be appreciated, thanks.

ListView

answered on 19 Sep 2013

1 answer

98 views

Hi

Using ajax my data source is configured as follow:

.Read(read => read.Action("Containers_Read", "ContainerAdmin"))

.Create(update => update.Action("Containers_Create", "ContainerAdmin"))

.Update(update => update.Action("Containers_Update", "ContainerAdmin"))

.Destroy(update => update.Action("Containers_Delete", "ContainerAdmin"))

When my grid first loads all the related entities with data comes through from the repository just fine:

public ActionResult Containers_Read([DataSourceRequest] DataSourceRequest request)

{

return Json(_repository.GetAllAssetTakeOnContainers().ToDataSourceResult(request));

}

public List<AssetTakeOnContainer> GetAllAssetTakeOnContainers()

{

using (var context = new AssetTakeOnContext())

{

context.Configuration.LazyLoadingEnabled = false;

return context.AssetTakeOnContainers.Include("TakeOns").Include("LocationLevel1").Include("LocationLevel2").Include("LocationLevel3").Include("CostCntrLevel1").Include("CostCntrLevel2").Include("CostCntrLevel3").Include("Contact").Include("RoomType").Where(c => c.IsDeleted == false).ToList();

}

But as soon as I do an update my related entities seems to be populated but all properties set to null:

[AcceptVerbs(HttpVerbs.Post)]

public ActionResult Containers_Update([DataSourceRequest] DataSourceRequest request, AssetTakeOnContainer container)

{

_repository.UpdateAssetTakeOnContainer(container);

return Json(ModelState.ToDataSourceResult());

}

Please see attached file for a screenshot from VS.

Can someone please tell me why this is and what I'm doing wrong here?

Thanks

Grid

answered on 19 Sep 2013

1 answer

135 views

Kendo UI 2013.2.918 zip file corrupted?

Hi,

I try to download the following file "kendoui.aspnetmvc.2013.2.918.commercial.zip", the website said it is 16mb but after downloaded it only has 10mb, open the zip displayed error message. Thanks.

Installer and VS Extensions

answered on 19 Sep 2013

9 answers

158 views

Paging issue after upgrade to v2013.2.716

I seem to have hit an issue with paging after upgrading to the latest version of kendo.

It happens with ajax and server binding. It appears that the filter data for the data source passes undefined values, which results in a 500 error on the server when it tries to bind to the filter values. If I apply a filter, paging starts to work again.

(server binding example)

Grid Code
@(Html.Kendo()
.Grid(Model.Items)
.Name("operatorList")
.DataSource(ds => ds.Server())
.Columns(columns =>
{
columns.Bound(c => c.Name);
})
.Filterable()
.Pageable())

Action
public ActionResult Index()
{
var vm = new LookUpIndexViewModel<T>();
vm.Recent = GetRecentlyActive();
vm.Items = All();
return View(vm);
}

Url Requested (when paging)
http://localhost/browse/operator?operatorList-sort=&operatorList-page=2&operatorList-pageSize=15&operatorList-group=&operatorList-filter=undefined~undefined~undefined

Scripts Included (in this order)
<script src="/scripts/kendo.all.js"></script>
<script src="/scripts/kendo.aspnetmvc.js"></script>
doulbe checked versions also both say: v2013.2.716

Stack Trace
[NullReferenceException: Object reference not set to an instance of an object.]
Kendo.Mvc.Infrastructure.Implementation.FilterNodeVisitor.Visit(PropertyNode propertyNode) +60
Kendo.Mvc.UI.DataSourceRequestModelBinder.BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext) +465
Kendo.Mvc.UI.Grid`1.ProcessDataSource() +395
Kendo.Mvc.UI.Grid`1.WriteHtml(HtmlTextWriter writer) +1145
Kendo.Mvc.UI.WidgetBase.ToHtmlString() +105
Kendo.Mvc.UI.Fluent.WidgetBuilderBase`2.ToHtmlString() +19
System.Web.WebPages.WebPageExecutingBase.WriteTo(TextWriter writer, Object content) +57
CtrlDev.Wdb.Web.Areas.Browse.Views.Operator.Index.Execute() in f:\Projects\CtrlDev.WDB\CtrlDev.Wdb.Web\Areas\Browse\areas\browse\views\operator\Index.cshtml:26
System.Web.WebPages.WebPageBase.ExecutePageHierarchy() +279
System.Web.Mvc.WebViewPage.ExecutePageHierarchy() +124
System.Web.WebPages.StartPage.ExecutePageHierarchy() +142
System.Web.WebPages.WebPageBase.ExecutePageHierarchy(WebPageContext pageContext, TextWriter writer, WebPageRenderingBase startPage) +103
RazorGenerator.Mvc.PrecompiledMvcView.Render(ViewContext viewContext, TextWriter writer) +951
System.Web.Mvc.ViewResultBase.ExecuteResult(ControllerContext context) +377
System.Web.Mvc.<>c__DisplayClass1a.<InvokeActionResultWithFilters>b__17() +32
System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilter(IResultFilter filter, ResultExecutingContext preContext, Func`1 continuation) +613
System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilter(IResultFilter filter, ResultExecutingContext preContext, Func`1 continuation) +613
System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilter(IResultFilter filter, ResultExecutingContext preContext, Func`1 continuation) +613
System.Web.Mvc.ControllerActionInvoker.InvokeActionResultFilter(IResultFilter filter, ResultExecutingContext preContext, Func`1 continuation) +613
System.Web.Mvc.ControllerActionInvoker.InvokeActionResultWithFilters(ControllerContext controllerContext, IList`1 filters, ActionResult actionResult) +263
System.Web.Mvc.Async.<>c__DisplayClass25.<BeginInvokeAction>b__22(IAsyncResult asyncResult) +236
System.Web.Mvc.<>c__DisplayClass1d.<BeginExecuteCore>b__18(IAsyncResult asyncResult) +28
System.Web.Mvc.Async.<>c__DisplayClass4.<MakeVoidDelegate>b__3(IAsyncResult ar) +15
System.Web.Mvc.Controller.EndExecuteCore(IAsyncResult asyncResult) +42
System.Web.Mvc.Async.<>c__DisplayClass4.<MakeVoidDelegate>b__3(IAsyncResult ar) +15
System.Web.Mvc.<>c__DisplayClass8.<BeginProcessRequest>b__3(IAsyncResult asyncResult) +42
System.Web.Mvc.Async.<>c__DisplayClass4.<MakeVoidDelegate>b__3(IAsyncResult ar) +15
System.Web.CallHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute() +1725
System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously) +560

Found this question on SO, not sure if it is related, but it sounds like it.

Any help would be greatly appreciated!

Thanks!
Josh

Grid

answered on 19 Sep 2013

1 answer

296 views

Paging gives 404 error when using .DataSource

I am having trouble getting Paging to work while using the DataSource option on a Kendo UI Grid, using MVC wrappers.

When I comment out the DataSource code, paging works just fine.
When I use the DataSource option, it gives me a 404 "not found" error when I try to move to another page.

See the attached screenshots for my code. One screenshot is the .cshtml file. The other is the Controller.

Can anyone please help?

Grid

answered on 18 Sep 2013

1 answer

338 views

Refresh Kendo MVC Detail Grid After Update

I have a ajax bound grid with master / detail. Having problems getting the detail grid to refresh after saving an update. The data is saving correctly, you can see it update after i force the action method of the controller to be called by doing a sort. For that reason, i thought reading the datasource again from a client side event handler for the save event would do the trick.

Here's my client detail template in the view:

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

@(Html.Kendo().Grid<CNX.Domain.Entities.MatchedT94EDI417Railcar>()

.Name("MatchingEDI417s_#=Id#")

.Editable(editable => editable.Mode(GridEditMode.PopUp).Window(w => w.Modal(true)

.Width(500)

.Height(510)

.Resizable(x => x.Enabled(true))

//.Events(x => x.Close("ClosingEditWindow"))

) )

.Columns(columns =>

{

columns.Bound(o => o.MATCHING_GUID).Visible(false);

columns.Bound(o => o.N7_GUID).Visible(false);

columns.Bound(o => o.EDI_OWNER_CODE).Width("50");

columns.Bound(o => o.T94_OWNER_CODE).Width("50");

columns.Bound(o => o.EDI_EQUIPMENT_NUMBER).Width("75");

columns.Bound(o => o.T94_EQUIPMENT_NUMBER).Width("75");

columns.Bound(o => o.EDI_GROSS_WEIGHT).Width("75");

columns.Bound(o => o.EDI_TARE_WEIGHT).Width("75");

columns.Bound(o => o.T94_SEQUENCE_NUMBER);

columns.Command(commands => { commands.Edit(); }).Title("Edit Railcar").Width("50");

columns.Bound(o => o.RREGUID).Visible(false);

columns.Bound(o => o.EDI_417_GUID).Visible(false);

columns.Bound(o => o.HeaderGuid).Visible(false);

})

.DataSource(dataSource => dataSource.Ajax()

.PageSize(10)

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

.Read(read => read.Action("MatchedEDI417sDetail", "MenuEDI", new { matchingGuid = "#=Id#" }).Type(HttpVerbs.Post))

.Update(update => update.Action("MatchedEDI417sUpdate", "MenuEDI" , Model).Type(HttpVerbs.Post))

)

.Pageable()

.Sortable()

.Filterable()

.Events( events => events.Save("detailSave"))

.ToClientTemplate()

);

</script>

<script>

function detailSave() {

alert('Save Event');

this.dataSource.read();

}

</script>

Here's the controller action method:

[HttpPost]

public ActionResult MatchedEDI417sUpdate(MatchedT94EDI417Railcar railCar, [DataSourceRequest] DataSourceRequest request)

{

TempData["role"] = GetRole();

matchedT94EDI417RailCarRepository.Save(railCar);

return Json(matchedT94EDI417RailCarRepository.RailCarsMatchedT94EDI417(railCar.MATCHING_GUID).ToDataSourceResult(request));

}

Any suggestions appreciated.

Grid

answered on 18 Sep 2013

1 answer

79 views

Server side paging through querystring

Hi,

I would like the listview control to populate the querystring as it does with the Gridview control when I followed the custom binding example: http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/custom-binding
This is because I need to allow the user to be able to bookmark the current listview result page
I am requiring the ListView control rather than the Gridview due to the formatting I am applying to each item
Please could you advise how this may be achieved?

Many thanks,

ListView

answered on 18 Sep 2013

0 answers

81 views

NumericTextBox Decimals issue in IE9, FF 23

Hello,

i cannot enter digits after the decimal separator in the UI, apparantly it works in IE10 but not in IE9 and FF
(the version is use is Kendo UI v2013.2.716)

culture is set to "en-US" via web.config globalization

<globalization culture="en" uiCulture="en-US"/>

this is info in the header of the page

       <link rel="stylesheet" href="/assets/styles/kendo.common.min.css" type="text/css" media="all" />
        <link rel="stylesheet" href="/assets/styles/kendo.metro.min.css" type="text/css" media="all" />
        <link rel="stylesheet" href="/assets/css/screen.css" type="text/css" media="all" />

        <script type="text/javascript" src="/assets/js/jquery.min.js"></script>
        <script type="text/javascript" src="/assets/js/kendo.all.min.js"></script>
        <script type="text/javascript" src="/assets/js/kendo.aspnetmvc.min.js"></script>
        <script type="text/javascript" src="/assets/js/cultures/kendo.culture.en.min.js"></script>
        <script type="text/javascript" src="/assets/js/cultures/kendo.culture.en-US.min.js"></script>

        <script type="text/javascript">
            kendo.culture("en-US");
        </script>

this is the .net code for generating the input element (.net datatype is decimal)

<td>@(Html.Kendo().NumericTextBoxFor(s => s.QuantitativeCost.AdditionalInformation.PaymentToRetailersForEWaste).Decimals(2).HtmlAttributes(new { style = "text-align:right;" }).Spinners(false).Enable(!Model.QuantitativeCost.IsCompleted).Deferred())</td>

can you help me out ? i'm i missing something ?

kind regards,

NumericTextBox

asked on 18 Sep 2013