Questions on UI for ASP.NET MVC Forum

1 answer

521 views

FileManager read results not binding

I am trying to get a basic FileManager widget working in our app, but cannot get a remote data bind working correctly.

My Javascript looks like this:

createFileManager: function () {

$("#fileManager").kendoFileManager({

dataSource: {

schema: kendo.data.schemas.filemanager,

transport: {

read: {

url: "myController/Read/",

method: "POST"

},

change: function (e) {

},

error: function (e) {

},

toolbar: {

items: [

{ name: "sortDirection" },

{ name: "sortField" },

{ name: "changeView" },

{ name: "spacer" },

{ name: "details" },

{ name: "search" }

]

},

draggable: true,

resizable: true,

dataBound: onDataBound

});

},

And my controller code is thusly:

// borrowed from Kendo service example...

public class FileManagerEntry

{

public string Name { get; set; }

public long Size { get; set; }

public string Path { get; set; }

public string Extension { get; set; }

public bool IsDirectory { get; set; }

public bool HasDirectories { get; set; }

public DateTime Created { get; set; }

public DateTime CreatedUtc { get; set; }

public DateTime Modified { get; set; }

public DateTime ModifiedUtc { get; set; }

public IEnumerable<FileManagerEntry> Directories { get; set; }

}

// CONTROLLER snippet....

public JsonResult Read(string target)

{

var content = GetContent();

var result = content

.Select(f => new

{

name = f.Name,

size = f.Size,

path = f.Path,

extension = f.Extension,

isDirectory = f.IsDirectory,

hasDirectories = f.HasDirectories,

created = f.Created,

createdUtc = f.CreatedUtc,

modified = f.Modified,

modifiedUtc = f.ModifiedUtc

});

return Json(result, JsonRequestBehavior.AllowGet);

}

// Hardcoded data for testing...

private IEnumerable<FileManagerEntry> GetContent()

{

return new List<FileManagerEntry>

{

new FileManagerEntry

{

Name = "Folder",

Size = 0,

Path = "folder",

Extension = "",

IsDirectory = true,

HasDirectories = false,

CreatedUtc = DateTime.UtcNow,

Created = DateTime.Now,

ModifiedUtc = DateTime.UtcNow,

Modified = DateTime.Now

},

new FileManagerEntry

{

Name = "Image.jpg",

Size = 20,

Path = "folder/Image.jpg",

Extension = ".jpg",

IsDirectory = false,

HasDirectories = false,

CreatedUtc = DateTime.UtcNow,

Created = DateTime.Now,

ModifiedUtc = DateTime.UtcNow,

Modified = DateTime.Now

},

new FileManagerEntry

{

Name = "Image2.jpg",

Size = 20,

Path = "folder/Image2.jpg",

Extension = ".jpg",

IsDirectory = false,

HasDirectories = false,

CreatedUtc = DateTime.UtcNow,

Created = DateTime.Now,

ModifiedUtc = DateTime.UtcNow,

Modified = DateTime.Now

}

};

}

Most of the code, I cobbled together from the Kendo examples for FileManager.

When I run my app.... The FileManager renders & the FileManager dataBound event fires. But the three objects in the manager are all undefined. I jave attached screengrabs of the filemanager.datasource and also the file "details" as shown by FileManager.

i do not know why the data isn't binding appropriately. Is this a problem with the results coming from my controller?

Appreciate any help.

FileManager

answered on 09 Jun 2020

1 answer

74 views

Aggregate function support for Html.Telerik().Grid

Hi,

I am supporting an application where I need to apply some aggregate function to grid for calculating sum of columns.

Below is sample code

<%: Html.Telerik().Grid(Model.AgentSalesList)
.Name("AgentSalesList")
.DataBinding(dataBinding =>
{
dataBinding.Server()
.Select("AgentSalesGridAction", "AgentSales");
})
.Columns(columns =>
{
columns.Bound(o => o.AgentID).Width("25").Title("Agent ID");
columns.Bound(o => o.NetSales).Width("25%").Title("Net Sales");
columns.Bound(o => o.NetSeatsSold).Width("25%").Title("Net Seats Sold");
})
.Pageable(paging => paging.Enabled(true).PageSize(25))
.Footer(true)
.Sortable()
.Resizable(resizing => resizing.Columns(true))
.Scrollable(o => o.Enabled(false))
%>

There are few option available for same with MVC Kendo UI Grid but when I am trying to install MVC Kendo package from Nuget I am getting unsupported .net framework issue(4.0).

So don't we have support for aggregate function with Html.Telerik().Grid?

OR only option is to upgrade target .net framework and use MVC Kendo UI ?

Thanks,

Anurodh Kimni

General Discussions

answered on 08 Jun 2020

9 answers

1.1K+ views

Kendo Grid and DropDownList and not show records

I have a Kendo Grid and a DropDown List that work well. Thee is a field in one of the models (model:Products Field:Status), What I want is if the Field Status = "discontinued" I need to not display that record in the grid or the dropdown. How would I go about doing that?

General Discussions

answered on 08 Jun 2020

9 answers

4.6K+ views

DropdownList and how to refresh

I have a popup edit screen that has a few dropdown list on it. They work great until I do into a screen and add an item for that dropdown list and low and behold I go back to that edit screen I don't see the new item unless I exit out and go back in. I have found dropdownlist.dataSource.read(); but I am not sure how to use that. Can someone tell me how to refresh the dropdown list please? I would think that when I open the edit pop up screen it would do it but it does not. I need to get an answer to this quickly.

Thanks

DropDownList

answered on 04 Jun 2020

10 answers

1.3K+ views

How to save the expanded state of Kendo Treelist

I need to save the expanded/collapsed state of Kendo UI Treelist so that nodes are expanded when I visit another page and come back.

It can be done for Treeview but not able to replicate the same. (http://jsfiddle.net/lhoeppner/rwfsf/)

TreeList

answered on 03 Jun 2020

1 answer

414 views

Label For

Is there a form to put a 'label for' on a old version @(Html.Kendo().TextBox() 2015.1.429.545?

It has not the .label prop

Thanks

Sergio

MaskedTextBox

answered on 03 Jun 2020

15 answers

4.9K+ views

How do you get the selected rows?

How do you get the selected rows in the grid? I found some articles that explained on how to do this. But none of them worked (it seemed like things changed in the latest beta).This is my grid:

@(Html.Kendo().Grid(Model)
        //The grid will be bound to the Model which is the Products table
.Name("dg") //The name of the grid is mandatory. It specifies the "id" attribute of the widget.
.Columns(columns =>
    {
        columns.Bound(dg => dg.Title);
        columns.Bound(dg => dg.Version);
        columns.Bound(dg => dg.Created).Format("{0:d}");
        columns.Bound(dg => dg.CreatedBy);
        columns.Bound(dg => dg.Modified).Format("{0:d}");
        columns.Bound(dg => dg.ModifiedBy);
        columns.Bound(dg => dg.CheckedOutDateTime).Format("{0:d}");
    })
.Sortable()
.Pageable()
.Navigatable()
.Sortable()
.Filterable()
.Selectable(s => s.Mode(GridSelectionMode.Multiple))
.DataSource(dataSource => dataSource
        .Server()
        .Model(model => model.Id(dg => dg.DocumentGroupID)))
.Events(events => events.Change("dgChange"))
)

Grid

answered on 02 Jun 2020

2 answers

8.8K+ views

Kendo Mvc Grid Template Column

I'm testing out some conversion of MVC grid to Kendo grid, and i'm running into several issues with template columns. Am I doing something wrong here?

In some scenarios, I get "undefined" showing in the column, others I'm getting a javascript error "cannot call kendoSortable
on undefined". I assume they're both the same issue related to the rendering of the column.

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

.Name("Grid")

.Columns(columns =>

{

columns.Template(o => Html.ActionLink(o.ProductID.ToString(), "Index", "Home"));

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

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

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

})

.Groupable()

.Pageable()

.Sortable()

.Scrollable()

.Filterable()

.DataSource(dataSource => dataSource

.Ajax()

.Read(read => read.Action("Products_Read", "Grid"))

)

Thanks!
Jason

Grid

answered on 02 Jun 2020

11 answers

1.9K+ views

How to set Grid PageSize 'All' by wrapper?

Hi,
The lastest release version (2015.2.624) add a useful feature that display 'all' option in pager.
But I didn't find it in ASP.NET MVC Wrapper function.
I try insert '0' pagesize and it seems as same as 'all' option.

.Pageable(pager => pager.PageSizes(new int[] { 5, 10, 20, 0 }))

But it displayed '0' in pager and I didn't find the method that change the 'all' message by MVC Wrapper.
It seems not exist in pager.Messages.

Can someone advise me, please?

Grid

answered on 01 Jun 2020

1 answer

116 views

How to get filtered value when exporting excel

Hi All

I just want to learn when i do custom excel export i want to get filtered data from ajax request

I tried .view() but it just return data on screen like if i have 20 data and show just 10 of them i get just 10 of them

on the other hand i tried .data() function but that is returning all data and i have really huge data like 15k data

How to get just filtered data?

here my grid and js functon and controller

@( Html.Kendo().Grid<Orpac.Controllers.DashboardsController.ATGAlerts>()

.Name("grdProductAlert").AutoBind(false)

.HtmlAttributes("width: 100%;cellpadding:0;")

.DataSource(d => d.Ajax().Read(r => r.Action("GridProductAlertBinding", "Dashboards").Type(HttpVerbs.Get)).ServerOperation(false))

.Columns(columns =>

{

columns.Bound(e => e.BelIdent).Title("Id").Width("auto");

columns.Bound(e => e.StationCode).Title("Station Code").Width("auto");

columns.Bound(e => e.StationName).Title("Station Name").Width("auto");

columns.Bound(e => e.BelTarih).Title("Date Time").ClientTemplate("#= kendo.toString(BelTarih, 'MM/dd/yyyy') #").ClientGroupHeaderTemplate("DateTime" + ": #=  kendo.toString(value, 'MM/dd/yyyy') #").Width("auto");

columns.Bound(e => e.BelInsTime).Title("Alert Time").ClientTemplate("#= kendo.toString(BelInsTime, 'MM/dd/yyyy HH:mm tt') #").ClientGroupHeaderTemplate("DateTime" + ": #=  kendo.toString(value, 'MM/dd/yyyy HH:mm tt') #").Width("auto");

columns.Bound(e => e.ProductCode).Title("Product Code").Width("auto");

columns.Bound(e => e.BelAlarm).Title("Alarm").Width("auto");

columns.Bound(e => e.BelLevelPerc).Title("Level %").Width("auto");

columns.Bound(e => e.BelTotCapacity).Title("Total Capacity").Width("auto");

columns.Bound(e => e.BelFuelVolume).Title("Available Volume").Width("auto");

}

)

.ToolBar(toolBar =>

{

toolBar.Custom().Text(" ").HtmlAttributes(new { @class = "btnexcel", href = "#", onclick= "testexcel()" });

toolBar.Custom().Text((string)ViewData["ClearFilter"]).HtmlAttributes(new { @class = "k-button", id = "cleargrid", href = "#", onclick = "clearFiltersFuelLevel()" });

}

)

.Selectable()

.Sortable()

.Pageable(pageable => pageable

.Refresh(true)

.PageSizes(true)

.ButtonCount(5))

.Filterable(filterable => filterable

.Extra(false)

.Operators(operators => operators

.ForString(str => str.Clear()

.StartsWith((string)ViewData["Startswith"])

.Contains((string)ViewData["Contains"])

))

)

.Groupable()

.Scrollable(scrolling => scrolling.Height("100%"))

.Resizable(config =>

{

config.Columns(true);

})

.Reorderable(config =>

{

config.Columns(true);

})

.ColumnMenu()

)

here my js

function testexcel() {

var grid = $("#grdProductAlert").data('kendoGrid');

var viewdata = {

data: grid.dataSource.view()

};

var url = '../Dashboards/ExportCsvList';

$.ajax({

type: "POST",

url: url,

traditional:true,

data: { request: viewdata.data },

success: function (msg) {

}

});

}

here my conroller

public FileResult ExportCsvList(List<ATGAlerts> request)

{

//Get the data representing the current grid state - page, sort and filter

var products = request;

using (System.IO.MemoryStream stream = new System.IO.MemoryStream())

{

/* Create the worksheet. */

SpreadsheetDocument spreadsheet = Excel.CreateWorkbook(stream);

Excel.AddBasicStyles(spreadsheet);

Excel.AddAdditionalStyles(spreadsheet);

Excel.AddWorksheet(spreadsheet, "ProductAlert");

Worksheet worksheet = spreadsheet.WorkbookPart.WorksheetParts.First().Worksheet;

//create columns and set their widths

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 1, "Ident", false, false);

Excel.SetColumnWidth(worksheet, 1, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 2, "Station Code", false, false);

Excel.SetColumnWidth(worksheet, 2, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 3, "Station Name", false, false);

Excel.SetColumnWidth(worksheet, 3, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 4, "Date Time", false, false);

Excel.SetColumnWidth(worksheet, 4, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 5, "Alert Time", false, false);

Excel.SetColumnWidth(worksheet, 5, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 6, "Product Code", false, false);

Excel.SetColumnWidth(worksheet, 6, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 7, "Alarm", false, false);

Excel.SetColumnWidth(worksheet, 7, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 8, "Level %", false, false);

Excel.SetColumnWidth(worksheet, 8, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 9, "Total Capacity", false, false);

Excel.SetColumnWidth(worksheet, 9, 50);

Excel.SetColumnHeadingValue(spreadsheet, worksheet, 10, "Available Volume", false, false);

Excel.SetColumnWidth(worksheet, 10, 50);

/* Add the data to the worksheet. */

// For each row of data...

for (int idx = 0; idx < products.Count; idx++)

{

// Set the field values in the spreadsheet for the current row.

Excel.SetCellValue(spreadsheet, worksheet, 1, (uint)idx + 2, products[idx].BelIdent.ToString(), false, false);

Excel.SetCellValue(spreadsheet, worksheet, 2, (uint)idx + 2, products[idx].StationCode, false, false);

Excel.SetCellValue(spreadsheet, worksheet, 3, (uint)idx + 2, products[idx].StationName, false, false);

Excel.SetCellValue(spreadsheet, worksheet, 4, (uint)idx + 2, products[idx].BelTarih.Value, 1, false);

Excel.SetCellValue(spreadsheet, worksheet, 5, (uint)idx + 2, products[idx].BelInsTime.Value, 1, false);

Excel.SetCellValue(spreadsheet, worksheet, 6, (uint)idx + 2, products[idx].ProductCode, false, false);

Excel.SetCellValue(spreadsheet, worksheet, 7, (uint)idx + 2, products[idx].BelAlarm, false, false);

Excel.SetCellValue(spreadsheet, worksheet, 8, (uint)idx + 2, products[idx].BelLevelPerc.ToString(), false, false);

Excel.SetCellValue(spreadsheet, worksheet, 9, (uint)idx + 2, products[idx].BelTotCapacity.ToString(), false, false);

Excel.SetCellValue(spreadsheet, worksheet, 10, (uint)idx + 2, products[idx].BelFuelVolume.ToString(), false, false);

}

/* Save the worksheet and store it in Session using the spreadsheet title. */

worksheet.Save();

spreadsheet.Close();

return File(stream.ToArray(), //The binary data of the XLS file

"application/vnd.ms-excel", //MIME type of Excel files

"ProductAlert.xlsx");

}

please help

Grid

answered on 01 Jun 2020