Questions on UI for ASP.NET MVC Forum

3 answers

176 views

In the current edition, a bug has been introduced

When doing a row level filter and you us contains, typing something in where what you type is contained in a string will say no data found

You can see the bug here in the demo

http://demos.telerik.com/aspnet-mvc/grid/filter-row

in the ship name, type carnes, it shows no data found, hit enter and it will show you the records with carnes, 14 rows.

I would like to know if the drop down box that shows no records can be removed or fixed.

Grid

answered on 12 Oct 2016

5 answers

469 views

Set Selected Item and Show It

It is possible to set the selection in a grid with paging and to show the page with the selection when the grid is initialized.

Grid

answered on 12 Oct 2016

2 answers

231 views

Custom View Grouping all-day events in one Event Count

Hi!

I'm using a kendo Scheduler in cshtml.

@(Html.Kendo().Scheduler<TaskViewModel>()

.Name("scheduler")

.Views(views =>

{

views.DayView();

views.CustomView("CustomDateRangeView ");

})

.DataSource(d => d

.Read("Read", "Home")

.Create("Create", "Home")

.Destroy("Destroy", "Home")

.Update("Update", "Home")

)

In this scheduler I'm using a custom view defined below. This works fine but I want to group only the all-day events in one Event Count like this example: Create Custom month View with Event Count in Show More Button

I tried to create the method _positionEvent in the custom view but it didn't work...

I couldn't find any information about it, only examples but nothing explained.

//extend the base MultiDayView

var CustomDateRangeView = kendo.ui.MultiDayView.extend({

init: function (element, options) {

kendo.ui.MultiDayView.fn.init.call(this, element, options); //call the base init method

if (options.swipe) {

this._bindSwipe(); //bind the swipe event

}

},

options: { //set default values of the options

numberOfDays: 7,

swipe: false

},

calculateDateRange: function () {

var selectedDate = this.options.date,

numberOfDays = Math.abs(this.options.numberOfDays),

start = getMonday(selectedDate),

idx, length,

dates = [];

for (idx = 0, length = numberOfDays; idx < length; idx++) {

dates.push(start);

start = kendo.date.nextDay(start);

}

this._render(dates);

},

nextDate: function () {

return kendo.date.nextDay(this.endDate());

},

previousDate: function () {

var daysToSubstract = -Math.abs(this.options.numberOfDays); //get the negative value of numberOfDays

var startDate = kendo.date.addDays(this.startDate(), daysToSubstract); //substract the dates

return startDate;

},

_bindSwipe: function () { //bind the swipe event

var that = this;

var scheduler = that.element.closest("[data-role=scheduler]").data("kendoScheduler"); //get reference to the scheduler

that.content.kendoTouch({ //initialize Kendo Touch on the View's content

enableSwipe: true,

swipe: function (e) {

var action,

date;

if (e.direction === "left") {

action = "next";

date = that.nextDate();

} else if (e.direction === "right") {

action = "previous";

date = that.previousDate();

}

//navigate with the scheduler

if (!scheduler.trigger("navigate", { view: scheduler._selectedViewName, action: action, date: date })) {

scheduler.date(date);

}

});

}

});

function getMonday(d) {

d = new Date(d);

var day = d.getDay(),

diff = d.getDate() - day + (day == 0 ? -6 : 1); // adjust when day is sunday

return new Date(d.setDate(diff));

}

Thanks!

Scheduler

answered on 11 Oct 2016

7 answers

1.2K+ views

Enum DropDownList selected problem

I am trying to bind enum dropdownlist ,

I checked the html source and find two different results.

First, it shows value="Distribution", the dropdownlist will select correct value.

<input data-val="true" id="TradeType" name="TradeType" type="text" value="Distribution" data-role="dropdownlist" readonly="readonly" style="display: none;">

<script>

jQuery(function(){jQuery("#TradeType").kendoDropDownList({"change":TradeTypeChange,"dataSource":[{"Text":"Clearing","Value":"Clearing"},{"Text":"Contribution","Value":"Contribution"},{"Text":"Distribution","Value":"Distribution"}],"dataTextField":"Text","dataValueField":"Value"});});

</script>

Second, it shows value="1", so it will select wrong value. The correct value should be "DueInterest".

<input data-val="true" id="TDInterestType" name="TDInterestType" type="text" value="1" data-role="dropdownlist" readonly="readonly" style="display: none;">

<script>

jQuery(function(){jQuery("#TDInterestType").kendoDropDownList({"dataSource":[{"Text":"CancelInterest","Value":"CancelInterest"},{"Text":"DueInterest","Value":"DueInterest"},{"Text":"ReceiptInterest","Value":"ReceiptInterest"}],"dataTextField":"Text","dataValueField":"Value"});});

</script>

I don't how it happened, how could I solved it that second's dropdownlist will select correct value ?

DropDownList

answered on 11 Oct 2016

1 answer

323 views

Localization and date instead of datetime inside a grid

Hi,

I have a problem with a datetime in a grid.

It works like it should if date StartDate doesn't have a DateType. And gets a date and a timepicker in the grid.

If I change this to

[DataType(DataType.Date)]

public DateTime StartDate { get; set; }

I will get only the datepicker and not the timepicker.

But if I fill in the date I get "the field startdate must be a date" See attached picture

Maybe this is because of the locatlization? I have no clue at the moment.

To get a localization for all my webpages I have put inside the _Layout.cshtml the following

@{

string culture = System.Globalization.CultureInfo.CurrentCulture.ToString();

}

<script src="@Url.Content("~/Scripts/cultures/kendo.culture." + culture + ".min.js")"></script>

<script>

kendo.culture("@culture");

</script>

</head>

<body>

I can see this becomes

<script src="/Scripts/cultures/kendo.culture.nl-NL.min.js"></script>

<script>

kendo.culture("nl-NL");

</script>

Thanks for your support

Maurice

Grid

answered on 11 Oct 2016

1 answer

1.1K+ views

How to display List<object> Count in a cell

In a simple table, I know I'd be able to just call Count in a cell, and there weren't any problems. However, trying to do it in a Grid has been challenging:

This is how my MVC Grid looks like:

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

.Name("issue-grid")

.DataSource(dataSource => dataSource

.Ajax()

.Model(model => model.Id(x => x.LinkId))

.Read(read => read.Action("ContentExternalLink_Read", "ContentManagement"))

.Create(create => create.Action("ContentExternalLink_Create", "ContentManagement"))

.Update(update => update.Action("ContentExternalLink_Update", "ContentManagement"))

.Destroy(delete => delete.Action("ContentExternalLink_Destroy", "ContentManagement"))

.ServerOperation(true)

.PageSize(10))

.Columns(columns =>

{

columns.Bound(x => x.LinkId).Hidden();

columns.Bound(x => x.LinkTitle).Title("Title").Template(@<text>

<a href="@item.LinkUrl" taget="_blank">@item.LinkTitle</a>

</text>);

columns.Bound(x => x.LinkTypeId).Title("Type");

columns.Bound(x => x.LinkCreatedDate).Title("Created");

columns.Bound(x => x.ContentTagAssignments.Count).Title("Tags");

columns.Bound(x => x.LinkSource).Hidden();

columns.Bound(x => x.LinkPhoneNumber).Hidden();

columns.Bound(x => x.LinkDate).Hidden();

columns.Bound(x => x.LinkCreatedDate).Hidden();

columns.Bound(x => x.LinkModifiedDate).Hidden();

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

})

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

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

.Scrollable(scr => scr.Height("auto"))

.Sortable()

.Pageable(pageable => pageable

.Refresh(true)

.PageSizes(true)

.ButtonCount(5))

)

When I run that, I get the Javascript error: Cannot read property 'Count' of undefined.

Any ideas how to get what I want to achieve?

Thank you!
AJ

Grid

answered on 11 Oct 2016

2 answers

392 views

Formatting an Aggregate/ClientFooterTemplate Row

Hi, I have a grid with an aggregate footer and columns formatted with a ClientFooterTemplate. How can I format an entire aggregate row like set the background color across all cells in the row based on an aggregate value? Also, how can I hide the aggregate row - like when there is only one detail row in the grid? Does anyone have an example of either of these scenarios?

Thanks!

Grid

answered on 11 Oct 2016

1 answer

127 views

Change row color based on error happened in backend while updating records

I am updating spreadsheet rows one by one. I want to change row color of those rows which got error in the backend.

@(Html.Kendo().Spreadsheet()
.Name("spreadsheet")
.Sheetsbar(false)
.Toolbar(x => x.Data(false).Insert(false))
.HtmlAttributes(new { style = "width:100%;" })
.Rows(5000)
.Events(e => e.ExcelImport("niinStockImport"))
.Sheets(sheets =>
{
sheets.Add()
.Name("NiinStock")
.DataSource<DynMRO.DTO.Logistics.Planning.NiinStockSearchResultDTO>(ds => ds
.Ajax()
.Batch(true)
.Read(r => r.Action("NiinStockBulkSearchResults", "Logistics").Data("getCriteria"))
.Update(u => u.Action("NiinStockBulkUpdate", "Logistics").Data("getCriteria"))
.Events(e => e.Change("onChange"))
.Model(m =>
{
m.Id(p => new { p.NiinStockID, p.ORGID });
})
)
.Columns(columns =>
{
columns.Add().Width(100);
columns.Add().Width(415);
columns.Add().Width(0);
columns.Add().Width(0);
columns.Add().Width(145);
})

;
})
)

Spreadsheet

answered on 11 Oct 2016

2 answers

107 views

[Solved] GridForeignKey w/Filter Broken

Hi,

I've been using a modified version of GridForeignKey.chtml below that has stopped working correctly in 2016.3.914 (UI for ASP.Net MVC). Code is:

@model object

@(Html.Kendo().DropDownListFor(m => m)

.Filter("contains")

.BindTo((SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"])

.Height(500)

)

The problem is that after the upgrade to the 2016.3.914 version, as soon as I type a key to filter the dropdown, the dropdown closes, whereas before the upgrade the dropdown filtered to items that contained the typed in value and stayed open.

Any help appreciated.

Regards

Ian Parsons, UK.

Grid

answered on 11 Oct 2016

3 answers

548 views

Save Multiple Grids in Batch Save Mode with one Button Click MVC Razor

Please assist me to do save of multiple batch grids with one Button Click MVC Razor. I have two tabs, each has its own batch edit kendo grids (one for Item and the other Supplier). I only want save button to do both updates to the database. I tried on change of Tab to call savechanges to the supplier and then bring the view back to Item. After that the Item Grid became iractic, not able to edit and it keeps falling with 'VM817:17 Uncaught TypeError: Cannot read property 'end' of undefined.' everywhere I tried calling the var grid = $('#Grid').data('kendoGrid'); it gets undefined?

How do I make it go back to the activated Grid?

Thank you.

Grid

answered on 10 Oct 2016