Questions on UI for ASP.NET Core Forum

1 answer

96 views

DropDownLists Shared Datasource binding to subobject of model

Hello,

I have a shared datasource that returns a model that has four lists

Model:

public class BillModel : DocumentBaseModel

{

...

public List<HistoryModel> History { get; set; }
public List<AmendmentModel> Amendments { get; set; }
public List<OtherDocModel> OtherDocs { get; set; }
public List<PreviousVersionModel> PreviousVersions { get; set; }

}

Shared Datasource:

@(Html.Kendo().DataSource<BillModel>()
.Name("myDataSource")
.Custom(dataSource =>
{
dataSource
.Type("json")
.Transport(transport =>
{
transport.Read(read =>
{
read.Action("GetBill", "Bills", new { billNo = "#=Id#" });
});
});
})
)

And one of my DDLs:

@(Html.Kendo().DropDownList()
.Name("amendments")
.DataTextField("Name")
.DataValueField("LFID")
.DataSource("myDataSource")
.HtmlAttributes(new { style = "width: 100%" })
.ToClientTemplate()
)

DropDownList

answered on 31 Oct 2019

1 answer

304 views

DropDownLists Shared Datasource binding to subobject of model

Hello,
I have a model with a few lists. I am trying to use a shared datasource to populate a dropdownlist for each of these lists but I am having trouble with how to refer to a specific subobject within the object that is returned from the controller. I’m sure that this has been done before… I’m just having trouble finding an example.

My model looks like this:
public class BillModel : DocumentBaseModel
    {
        …

        public List<HistoryModel> History { get; set; }
        public List<AmendmentModel> Amendments { get; set; }
        public List<OtherDocModel> OtherDocs { get; set; }
        public List<PreviousVersionModel> PreviousVersions { get; set; }
    }

My controller returns the BillModel
My view has a grid that accesses a ClientTemplate that has three ddls and my shared datasource.
@(Html.Kendo().DataSource<BillModel>()
.Name("myDataSource")
       .Custom(dataSource =>
       {
              dataSource
                     .Type("json")
                     .Transport(transport =>
                     {
                           transport.Read(read =>
                           {
                              read.Action("GetBill", "Bills", new { billNo = "#=Id#"});
                            });
                     });
       })
)
@(Html.Kendo().DropDownList()
.Name("amendments")
       .DataTextField("Name")
       .DataValueField("LFID")
       .DataSource("myDataSource")
       .HtmlAttributes(new { style = "width: 100%" })
.ToClientTemplate()
)

@(Html.Kendo().DropDownList()
.Name("others")
       .DataTextField("Name")
       .DataValueField("LFID")
       .DataSource("myDataSource")
       .HtmlAttributes(new { style = "width: 100%" })
.ToClientTemplate()
)

@(Html.Kendo().DropDownList()
.Name("previous")
       .DataTextField("Name")
       .DataValueField("LFID")
       .DataSource("myDataSource")
       .HtmlAttributes(new { style = "width: 100%" })
.ToClientTemplate()
)

How do I get each ddl to use their list from the datasource? I thought perhaps I could use dot notation and write .DataTextField(“Amendments.Name”). It didn’t yell at me it just said undefined. I’m sure it must be something simple I just can’t figure it out today.

DropDownList

answered on 31 Oct 2019

2 answers

86 views

ExportToPdf works local, not production.

My project is core but this is really just simple view. I want to convert some simple html to pdf and "Save As" to the local machine. I dumbed down my actual view fo the example but please help me understand why this works (pdf is generated and saved to downloads) on my local machine but not in production (tried in Chrome/Edge/IE).

Heres a dojo link; http://dojo.telerik.com/@bdaun1@gmail.com/ (doesn't work here either... only when I run in dev on my machine)

Thanks!

BD

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<div class="box wide hidden-on-narrow">

<div class="box-col">

<button class="export-pdf k-button" onclick="getPDF()">ExportToPDF</button>

</div>

<div class="page-container hidden-on-narrow">

<div class="pdf-page">

<div class="pdf-header">

<span class="company-logo"></span>

</div>

<div class="pdf-body">

<div class="container">

<div class="row">

<div class="col-sm-8">

<p>Test Area1</p>

</div>

<div class="col-sm-12">

<hr />

<h3>Purpose Statement</h3>

<p>Test Area2</p>

</div>

<script>

function getPDF() {

kendo.drawing.drawDOM($('.pdf-page')).then(function (group) {

kendo.drawing.pdf.saveAs(group, "OrgOverview.pdf");

});

}

</script>

<style>

.pdf-page {

position: relative;

margin: 0 auto;

padding: .4in .3in;

color: #333;

background-color: #fff;

box-shadow: 0 5px 10px 0 rgba(0,0,0,.3);

box-sizing: border-box;

font-family: "DejaVu Sans", "Arial", sans-serif;

}

.pdf-header {

padding-bottom: .2in;

margin-bottom: .3in;

border-bottom: 1px solid #e5e5e5;

}

</style>

</body>

</html>

General Discussions

answered on 31 Oct 2019

1 answer

140 views

Is editing and mail merge functionality for document processing available for ASP.Net Core?

I've been looking through demos of document processing, and I'm only seeing format conversion in the demos for ASP.Net Core. When I view demos for document processing for ASP.Net MVC, I see mail merge and other functionality. Is mail merge and editing also supported in UI for ASP.Net Core?

General Discussions

answered on 30 Oct 2019

2 answers

874 views

ForeignKey and UIHint

Hello,

It's seem that ForeighKey always use GridForeignKey.cshtml…

I try to decorate the attribute UIHint with another cshtml (Shared/EditorTemplates) and it's not working. My dropdown list in the grid always use GridForeignKey.cshtml.

Any idea?

Grid

answered on 26 Oct 2019

1 answer

260 views

.NET Core extension to create project not working

Hello,
Out of the box, using the 'Telerik UI for ASP.NET Core' -> Create New Telerik Project (Grid and Menu) extension in Visual Studio 2019 + .NET Core 3.0 does not appear to work correctly. The project will get created and will build and run correctly, however when I try to add a new View or Controller I will get the attached error. I kept adding libraries that the error was complaining about until it worked, however I'm not sure this was the correct way to go about fixing this (see attached).

Is there a reason the out of the box extension to create a project is not working?
I've submitted a bug regarding this as well.

Thanks,
Dave

Installer and VS Extensions

answered on 25 Oct 2019

3 answers

271 views

dotnet CLI installs a wrong Nuget version for AspNet.Core

Hello,
we are currently following this guide (https://docs.telerik.com/aspnet-core/getting-started/first-steps-cli)
to setup Telerik UI for ASP.NET Core 3.0.100 (not RC).
After we run "dotnet add package Telerik.UI.for.AspNet.Core" we see that the version "2016.3.914" is downloaded and installed, and NOT the version "2019.3.917" we see from here: https://www.telerik.com/account/product-download?product=UIASPCORE
Obviously with old this version "dotnet run" throws errors.

What are we missing?

We tried to downgrade to dotnet SDK 3.0.100-RC but nothing changes.
Forcing installing the specific version with "dotnet add package Telerik.UI.for.AspNet.Core -v 2019.3.917" returns error "Unable to find package Telerik.UI.for.AspNet.Core with version (>= 2019.3.917)"
Our platform is Linux and we downloaded dotnet sdk from here https://dotnet.microsoft.com/download/thank-you/dotnet-sdk-3.0.100-linux-x64-binaries
We have trial license of Progress® Telerik® UI for ASP.NET Core

Thanks for your support

my nuget.config

<?xml version="1.0" encoding="utf-8"?>
<configuration>
<packageSources>
    <add key="nuget.org" value="https://api.nuget.org/v3/index.json" protocolVersion="3" />
    <add key="telerik.com" value="https://nuget.telerik.com/nuget" />
</packageSources>
<packageSourceCredentials>
      <telerik.com>
           <add key="Username" value="enrico.papi@re-lab.it" />
       <add key="ClearTextPassword" value="*********" />
      </telerik.com>
</packageSourceCredentials>
</configuration>

my csproj after we add the package:

<Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup>
<TargetFramework>netcoreapp3.0</TargetFramework>
</PropertyGroup>
<ItemGroup>
</ItemGroup>
<ItemGroup>
<PackageReference Include="Telerik.UI.for.AspNet.Core" Version="2016.3.914" />
</ItemGroup>
</Project>

Installer and VS Extensions

answered on 25 Oct 2019

2 answers

1.9K+ views

Custom checkbox change event not firing after gird page changed

Hi There,

I have a checkbox column in my grid, the change event works fine when page first loaded, but fails after page changed. Following is my code. Any help would be greatly appreciated.

@model IEnumerable<WebApplication1.Models.ProductViewModel>

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

.Name("grid")

.Columns(columns =>

{

columns.Bound(c => c.ProductID).ClientTemplate("<input class='checkBoxCustom' type='checkbox' />").Title(" ").Filterable(false).Width(50);

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

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

//columns.Command(command => command.Destroy()).Width(150);

})

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

.Pageable()

.Sortable()

.Scrollable()

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

.DataSource(dataSource => dataSource

.Ajax()

.Batch(true)

.PageSize(2)

.ServerOperation(false)

//.Events(events => events.Error("errorHandler"))

.Model(model =>

{

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

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

})

)

<script>

$(document).ready(function () {

$('input.checkBoxCustom').on('change', function (e) {

alert('hi');

});

</script>

Grid

answered on 24 Oct 2019

3 answers

635 views

export excel and pdf in asp.net core

Could you please replay i have 2 Q

1- i try to export excel and pdf file from my kendo grid but not work i am use Core 2.2
Telerik UI for ASP.NET Core R1 2018 SP1
Source Code from this link
https://demos.telerik.com/aspnet-core/grid/excel-export
2- the telerik Report it's Support the Core 2.2 or not

Thanks

Grid

answered on 24 Oct 2019

1 answer

113 views

Multiselect in Grid PopUp gives javascript error

Hi,

I have the following model:

public class SComponent

{

public string Id { get; set; }

public string Name { get; set; }

public KeyValuePair<string,string>[] Containers { get; set; }

}

which is bound to the Grid:

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

.Name("grid")

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

.Columns(columns =>

{

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

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

})

.Sortable(sortable => { sortable.SortMode(GridSortMode.SingleColumn); })

.Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("SharedLibrary"))

.DataSource(dataSource => dataSource.Ajax()

.Model(model =>

{

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

})

.Read(read => read.Action(nameof(SController.Editing_ReadSharedLibraries), "S", new { key = Model.Product.Keys.First() }))

.Update(update => update.Action(nameof(SController.Editing_UpdateSharedLibrary), "S", new { key = Model.Product.Keys.First() }))

.Destroy(update => update.Action(nameof(SController.Editing_DeleteSharedLibrary), "S", new { key = Model.Product.Keys.First() }))

.Create(update => update.Action(nameof(SController.Editing_CreateNewSharedLibrary), "S", new { key = Model.Product.Keys.First() }))

)

As you can see grid edit mode is a popup which is a custom template looking like this:

@model SComponent

<div class="k-edit-label">

@Html.LabelFor(model => model.Name)

</div>

<div class="k-edit-field">

@Html.Kendo().TextBoxFor(model => model.Name)

@Html.ValidationMessageFor(model => model.Name)

</div>

<div class="k-edit-label">

@Html.LabelFor(model => model.Containers)

</div>

<div class="k-edit-field">

@(Html.Kendo().MultiSelectFor(model => model.Containers)

.DataTextField("Value")

.DataValueField("Key")

.ValuePrimitive(true)

.Placeholder("Select containers...")

.IgnoreCase(true)

.Filter("contains")

.DataSource(source =>

{

source.Read(read =>

{

read.Action("Editing_ReadContainers", "Structurizr");

})

.ServerFiltering(true);

})

)

@Html.ValidationMessageFor(model => model.Containers)

</div>

And the controller method returning the multiselect list is like this:

public IActionResult Editing_ReadContainers([DataSourceRequest] DataSourceRequest request)

{

var model = new SModel(null, _st.GetWorkspaceAsync(string.Empty).Result);

var dsResult = model.Containers.Select(x=>KeyValuePair.Create(x.Id, x.Name)).ToDataSourceResult(request);

var json = JsonConvert.SerializeObject(dsResult);

return Content(json, "application/json");

}

But when server returns values back to the UI it fails with the javascript error:

kendo.all.js:7232 Uncaught TypeError: e.slice is not a function
at init.success (kendo.all.js:7232)
at success (kendo.all.js:7149)
at Object.n.success (kendo.all.js:6055)
at i (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at y (jquery.min.js:4)
at XMLHttpRequest.c (jquery.min.js:4)

Any idea how this can be fixed ?

MultiSelect

answered on 23 Oct 2019