Questions on UI for ASP.NET MVC Forum

2 answers

148 views

AJAX ListView not calling controller actions in .NET Core

public class FavoritesController : Controller
{
public IActionResult Favorites_Read([DataSourceRequest] DataSourceRequest request)
{
...

return Json(listings.ToDataSourceResult(request));
}
}

@(Html.Kendo().ListView<ListingDetails>()
.Name("listView")
.TagName("div")
.ClientTemplateId("listingTemplate")
.Pageable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Model(model => model.Id(p => p.ID))
.Create(update => update.Action("Favorites_Create", "Favorites"))
.Read(read => read.Action("Favorites_Read", "Favorites"))
.Update(update => update.Action("Favorites_Update", "Favorites"))
.Destroy(update => update.Action("Favorites_Delete", "Favorites"))
)
.Deferred()
)

I've set a breakpoint at the beginning of Favorites_Read, but the action is not being hit. Any help would be greatly appreciated.

ListView

answered on 27 Jul 2016

3 answers

378 views

Dynamic ListViews/Datasources

I am using Kendo UI 2016.1.226, Windows 7 Enterprise SP 1, Google Chrome 51.0.2704.79 m, SQL Server 2012

I created a ListView for available report filters (Filter List), which loads from a stored procedure and uses the HTML ListView wrapper. On Filter List databound, I am dynamically creating 2 more listviews (Available items and Selected items) for each item in the primary ListView. When an item is selected from the primary, if no items are currently in the available list, the datasource is read from a stored procedure, passing the report filter ID, and returns a list of KeyIndex (int) and Value (string) items from various DB tables. These are supposed to be loaded in the Available ListView's databound event. However, there are no items in the datasource after return from the stored procedure call.

I suspect the issue is a JSON vs. OData format issue (see 12/5/2011 post here: http://www.telerik.com/forums/connect-grid-to-mvc-controller-method). I don't care about grouping, filtering, and sorting of the items, but it seems like I may need to send a request object to the controller in order to call ToDataSourceResult, which I'm guessing converts JSON to OData format. The Available datasource has AutoBind set to false, so that I can load only the report filters as needed. When I try to pass information in the request, I get the following error because there is no data to group, filter, or sort yet:

jquery.min.js:3 Uncaught TypeError: Cannot read property 'length' of undefined

var availableDataSource = listViewAvailable.dataSource;
var parameterMap = availableDataSource.transport.parameterMap;
var request = parameterMap({ filter: availableDataSource.filter(), group: availableDataSource.group(), sort: availableDataSource.sort() });
availableDataSource.transport.options.read.url =
"/ReportCategory/GetFilterValues?FilterID=" + dataItem.ReportFilterID + "&TplNum=" + @ViewBag.TplNum + "&request=" + request;
availableDataSource.read();

If I leave the parameterMap empty, my controller routine is called, the JSON data is populated and returned to the client, but the number of items in the datasource is 0:

var request = parameterMap({ });

public async Task<ActionResult> GetFilterValues([DataSourceRequest]DataSourceRequest request, int FilterID = 0, int TplNum = 0)
{
var url = string.Format("{0}{1}/{2}", GlobalVariables.ApiBaseUrl.Replace("api", "GetFilterValues"), FilterID, TplNum);

var jsonResult = await Request.GetSerializedJsonResult<FilterValues>(url);
IList listFilterValues = (IList)jsonResult;

return Json(listFilterValues.ToDataSourceResult(request),JsonRequestBehavior.AllowGet);
}

Datasource definition:

filterDataSource = new kendo.data.DataSource({
type: "odata",
transport: {
read: {
url: "/api/GetFilterValues/" + filterRecord.ReportFilterID + '/' + @ViewBag.TplNum,
type: "GET",
dataType: "json"
},
},
schema: {
model: {
fields: {
KeyIndex: { type: "number" },
Value: { type: "string" }
}
},
data: function(data) { return data.value; },
total: function(data) { return data["odata.count"]; }
},
serverFiltering: true,
serverGrouping: true,
serverSorting: true
});

Available ListView:

idString = "Filters_1_" + filterIndex;
divString = '<div id="' + idString + '" class="filterlist1" style="display: none;"><h2>Available Values</h2></div>';
divStringInner = '<div class="filterlist1_inner"></div>';
$(divString).insertAfter('#ReportFilters');
$(divStringInner).insertAfter('#' + idString + ' h2').kendoListView({
dataSource: filterDataSource,
dataBound: onAvailableDataBound,
autoBind: false,
pageable: false,
selectable: selectableType,
template: kendo.template($('#' + templateName).html())
});

ListView item template (TBD being eventually replaced by the Value string in the datasource):

I saw something for SQL Server called FOR JSON AUTO that may help make the stored procedure OData compliant (https://msdn.microsoft.com/en-us/library/dn921897.aspx), but that is for SQL Server 2016 on. Any ideas?

ListView

answered on 09 Jun 2016

2 answers

65 views

Kendo ListView in RC1 Project

I am trying to use a ListView control in an ASP.NET RC1 project. I have added all the required stuff from the documentation..

1. js and styles folders

2. script references in layout

3. services.AddKendo(); in Startup.cs

However when I add this to my page I am getting a javascript error

jquery(...).kendoListView is not a function

@(Html.Kendo().ListView<Microsoft.Graph.Group>()
.Name("groupView")
.TagName("div")
.ClientTemplateId("grouplistTemplate")
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Groups_Read", "Groups"))
)
)

What could the issue be?

Thanks
AJ

ListView

answered on 03 Jun 2016

5 answers

146 views

ListView template with unnamed Datasource members

I am binding a ListView to a collection of strings. How can I access that data in the template definition? Model.SearchResults is a type of IEnumberable<string>

@(Html.Kendo().ListView(Model.SearchResults)

.Name("listClients")

.TagName("div")

.ClientTemplateId("clientsTemplate")

.Pageable(pageable => pageable

.PreviousNext(true)

.Info(true)

.PageSizes(true))

.HtmlAttributes(new{style="min-height:300px"})

.DataSource(dataSource => dataSource

.PageSize(1)))

<script type="text/x-kendo-tmpl" id="clientsTemplate">

@Html.Action("LoadProfileView", new { clientId = **HOW DO I GET THE VALUE HERE**})

</script>

ListView

answered on 25 May 2016

16 answers

299 views

Listview Selection - On Click / mousedown

I have a listivew that has single selection set.

However, I need part of the template area (div) to not trigger the selection where clicking in inside that div will do something else than cause the onchange to fire.

How would I do this without using an iframe?

Thank You in Advance.
Rene Pilon

ListView

answered on 18 May 2016

3 answers

122 views

data-uid missing on 1/2 of items

Hello

We have a Listview that populates with an IEnumerable<object> The data source is set and the read called when a Kendo DropdownList.Change Event is called.

We have found that the first 1/2 the records with generate elements with data-uid, role="option" & aria-selected="false", while the latter 1/2 do not. There is no difference in the records, if we add a single record to the list at a time, it will produce the same result, the first 1/2 with, the second 1/2 without.

we are using an external template (pls see below):

We see this behavior on 2 different ListViews, albeit on the same page with the same data types (objects).

Thanks for your help in advance

ListView

answered on 11 Apr 2016

2 answers

181 views

Client side paging example?

Hi, sorry if this is documented somewhere but I didn't find it. Is it possible to do client side paging with the listview so the entire dataset is stored on the client-side?

Reason I ask is I have one item per page and always in "Edit" mode. When I change pages any changes are lost, unless I save it to DB automatically when paging, which I want to avoid. I'd like to be able to have the entire dataset on the client-side and changes saved client-side only. Is there an out of the box way to do this?

ListView

answered on 02 Apr 2016

3 answers

82 views

Listview template failed to pass string to controller.

can someone tell me why this is not working? I am trying to puss the ID of the video to GetVideoDuration().

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

<div class="duration">

@{string VID = "VID"

;}

@VID.Replace("Vimeo_ID", "${VID}")

@MultimediaController.GetVideoDuration(VID)

</div>

</script>

Second line display the correct VID on every record. But when GetVideoDuration() is getting executed the value passed is VID string not the actual number.

multimedia controller.

public static string GetVideoDuration(string VID)

{

string strDuration = string.Empty;

}

ListView

answered on 25 Dec 2015

1 answer

135 views

ListView not showing template

I have a very simple listview that I cannot get to show any data.

View:

@(Html.Kendo().ListView<PortalContext.Root>()
.Name("leafView")
.TagName("div")
.ClientTemplateId("leafTemplate")
.DataSource(dataSource => {
dataSource.Model(model => { model.Id(p => p.RootId);
model.Field<string>(f => f.ShortName);
});
dataSource.Read(read => read.Action("Leafs", "Home").Data("branchLevel"));
})
)

I have a treeview that refreshes the data onSelect

function onSelect(e) {
if (treeview.dataItem(e.node).IsBranch) {
branchId = treeview.dataItem(e.node).id;
$("#leafView").data("kendoListView").dataSource.read();
}
}

function branchLevel() {
return {
branchId: branchId
};
}

I have simplified a few things but my controller looks like this and is basically returning a list of objects.

public ActionResult Leafs([DataSourceRequest]DataSourceRequest request, int? branchId) {

return Json(ViewModel.Roots.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

Any ideas why this may not be working?

Bill

ListView

answered on 18 Nov 2015

1 answer

73 views

Is it possible to use Kendo MVC Listview with complex objects

Hi ! Im searching for a solution of my problem. Ich have a simple table named job with foreign keys from category and customer. I woultd like to edit this structure by using a listvew. My template is looking like:

.....

But when I click on the "add new Job"- button I will get the javscript error "Uncaught ReferenceError: Category is not defined". When I'm using the grid this is able to work, but not in Listview. What I'm doing wrong?

best regards Andreas Laffer

ListView