Questions on UI for ASP.NET Core Forum

5 answers

525 views

How to set initial files from model when using upload tag helper?

I would like to use the tag helper, but I cannot set the initial files like

<files>@Html.Raw(Model.InitialFiles)</files>

I am only able to set them as static HTML list, i.e.

(https://docs.telerik.com/aspnet-core/tag-helpers/editors/upload/overview)

Is it possible to use the tag helper when the file list would be obtained from a model? And how?

Upload

answered on 04 Sep 2019

1 answer

187 views

Grid - Bind to collection in page model

public class EncountersModel : PageModel

{

public EncountersModel(IDataAccess dataAccess)

{

this.dataAccess = dataAccess;

}

public IEnumerable<Encounter> Encounters { get; set; }

private readonly IDataAccess dataAccess;

public void OnGet()

{

Encounters = dataAccess.GetOpenEncounters();

}

@page

@model SafeUSWeb.Pages.EncountersModel

@{

ViewData["Title"] = "Encounters";

}

<h2>Encounters</h2>

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

.Name("grid")

.Columns(columns =>

{

columns.Bound(c => c.EncounterId).Width(140);

columns.Bound(c => c.EncounterType).Width(190);

columns.Bound(c => c.Status);

columns.Bound(c => c.Organization.OrgName).Width(110);

})

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

)

When I run this I get an error that says - Failed to load resource: net::ERR_SPDY_PROTOCOL_ERROR

Grid

answered on 04 Sep 2019

12 answers

1.3K+ views

Filtering on DateTime data type

I"m trying to filter a grid that is bound to many fields including a few that are DateTime. My filter works great until I try to do one on a datetime type field then it errors out. What operator can I use on a datetime? Here's the error and the settings for the filter.

Message"The binary operator GreaterThanOrEqual is not defined for the types 'System.DateTime' and 'System.String'."string

$("#Grid").data("kendoGrid").dataSource.filter({
logic: "or",
filters: [
{
field: "DateEntered",
operator: "gte",
value: searchValue
},
{
field: "DateEntered",
operator: "lte",
value: searchValue
},

Thanks!

Craig

Grid

answered on 04 Sep 2019

2 answers

532 views

Kendo UI for Asp .Net core 2.0

Hi,

Is Kendo UI works with asp .Net core 2.0 ?

If yes, can anyone have any demo on this. As, I am trying to use Kendo UI for my asp .net core 2.0 project and I am getting some issue there.

General Discussions

answered on 03 Sep 2019

4 answers

1.0K+ views

CSS intellisense not working

Hi

For some unknown reason, the intellisense suddenly stops working.

When i create a new asp.net core project using telerik's wizard, it is working ok.

I am using VS2017 with asp.net core R2 2019.

<environment include="Development">

<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />

<link rel="stylesheet" href="~/lib/kendo-ui/styles/kendo.common-bootstrap.min.css" />

<link rel="stylesheet" href="~/lib/kendo-ui/styles/kendo.metro.min.css" />

General Discussions

answered on 02 Sep 2019

1 answer

5.3K+ views

DataTables - header column width not aligned with body column width

Hi,

I am using DataTables from DataTables in TabStrip.

I figure i faced the same problem as mentioned here: datatable jquery - table header width not aligned with body width

There was a solution mentioned in the blog that works for Bootstrap Tab:

// If table is in the tab, you need to adjust headers when tab becomes visible.

// For example, for Bootstrap Tab plugin:

$('a[data-toggle="tab"]').on('shown.bs.tab', function(e){

$($.fn.dataTable.tables(true)).DataTable().columns.adjust();});

How can i do that for telerik TabStrip?

Here is my TabStrip in cshtml:

<div class="col-md-9 k-content wide">

@(Html.Kendo().TabStrip()

.Name("tabstrip")

.Animation(animation =>

animation.Open(effect =>

effect.Fade(FadeDirection.In)))

.Items(tabstrip =>

{

tabstrip.Add().Text("OEE")

.Selected(true)

.Content(@<text>

</text>);

tabstrip.Add().Text("System Performance")

.Content(@<text>

<div class="container">

<div class="row">

<div class="col-5">

<table id="systemPerfTable" class="table table-striped table-bordered" cellspacing="0">

<thead>

<tr>

<th>Item</th>

<th>Value</th>

</tr>

</thead>

<tbody>

<tr>

<th scope="row">Lot Elapsed Timestamp</th>

<td id="lotElapsedTimestamp">1/1/1900 00:00:00</td>

</tr>

<tr>

<th scope="row">Lot Submission Timestamp</th>

<td id="lotSubmissionTimestamp">1/1/1900 00:00:00</td>

</tr>

</tbody>

</table>

</div>

</text>);

})

)

</div>

Here is the script:

<script>

$("#systemPerfTable").DataTable({

scrollY: "500px",

scrollCollapse: true,

paging: false,

searching: false,

ordering: false,

info: false

});

</script>

TabStrip

answered on 30 Aug 2019

8 answers

1.3K+ views

Pre Filter Using DataSource .Filter

I have a grid that I would like to be filtered based on a button that a user clicks on a website. I have went through much of the documentation, but I am unable to find a way to filter without using a string. I would like to pass in a value. Is there something that I am missing here.

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

.Name("grid").Scrollable(c => c.Enabled(true).Height(1000))

.DataSource(dataSource => dataSource

.Ajax()

.Filter(f=>f.Add(a=>a.Status).IsEqualTo(""))

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

.PageSize(20)

)

Grid

answered on 30 Aug 2019

9 answers

122 views

AutoComplete show not found

Hi I have the code and result below, but Auto Complete show not fund any thing i missing or got it wrong here?

@(Html.Kendo().AutoComplete()
.Name("ceaSearch")
.HtmlAttributes(new { style = "width:100%" })
.DataTextField("salesperson_name")
.MinLength(1)
.DataSource(source =>{
   source.Read(read =>
   {
       read.Url("https://data.gov.sg/api/action/datastore_search")
       .Data("getCEAData");
   })
   .ServerFiltering(true)
   .Custom()
   .Schema(schema => schema
       .Data("records")
       .Type("json")
       .Model(model =>
       {
           model.Id("salesperson_nam");
           model.Field("registration_no", typeof(string));
           model.Field("estate_agent_name", typeof(string));
           model.Field("estate_agent_license_no", typeof(string));
       })
   );
}).Template("<span>#: records.salesperson_name#</span>"))

function getCEAData() {

   var value = $("#ceaSearch").data("kendoAutoComplete").value();
   return {
       resource_id: 'a41ce851-728e-4d65-8dc5-e0515a01ff31', // the resource id
       q: value
   };
}

The API returned data below. but Autocomplate show not found

{"help": "https://data.gov.sg/api/3/action/help_show?name=datastore_search", "success": true, "result": {"resource_id": "a41ce851-728e-4d65-8dc5-e0515a01ff31", "fields": [{"type": "int4", "id": "_id"}, {"type": "text", "id": "salesperson_name"}, {"type": "text", "id": "registration_no"}, {"type": "text", "id": "registration_start_date"}, {"type": "text", "id": "registration_end_date"}, {"type": "text", "id": "estate_agent_name"}, {"type": "text", "id": "estate_agent_license_no"}, {"type": "int8", "id": "_full_count"}, {"type": "float4", "id": "rank"}], "q": "merita", "records": [{"registration_end_date": "2019-12-31", "estate_agent_license_no": "L3008536D", "salesperson_name": "MERITA LOUISE TIN GUEK PING (DENG YUEPING) (MERITA LOUISE TIN)", "registration_no": "R000662B", "rank": 0.0706241, "_full_count": "2", "registration_start_date": "2015-11-03", "estate_agent_name": "LANDPLUS PROPERTY NETWORK PTE LTD", "_id": 30808}, {"registration_end_date": "2019-12-31", "estate_agent_license_no": "L3008536D", "salesperson_name": "MERITA LOUISE TIN GUEK PING (DENG YUEPING) (MERITA LOUISE TIN)", "registration_no": "R000662B", "rank": 0.0706241, "_full_count": "2", "registration_start_date": "2015-11-03", "estate_agent_name": "LANDPLUS PROPERTY NETWORK PTE LTD", "_id": 32886}], "_links": {"start": "/api/action/datastore_search?q=merita&resource_id=a41ce851-728e-4d65-8dc5-e0515a01ff31", "next": "/api/action/datastore_search?q=merita&offset=100&resource_id=a41ce851-728e-4d65-8dc5-e0515a01ff31"}, "total": 2}}

AutoComplete

answered on 29 Aug 2019

1 answer

329 views

0x800a1391 - JavaScript runtime error: 'kendo' is undefined occurred

Telerik UI for ASP.NET Core not working on Razor page Core 2.0

To replicate:

Create New Project -> .NET Core -> ASP.NET Core Web Application

Select -> Web Application (ASP.NET Core 2.0)

Added services.AddKendo(); to Startup.cs

Added @addTagHelper, etc . to _ViewImports.cshtml

Added link and script to _Layout.cshtml

Added @using Kendo.Mvc.UI and @(Html.Kendo().DatePicker().Name("my-picker")) to target page.

Encountered error showed in title.

General Discussions

answered on 28 Aug 2019

3 answers

1.6K+ views

PDF file fails to process

I am using the example from: https://demos.telerik.com/aspnet-core/pdfviewer/index

No matter what PDF file I put in the code I get the message "PDF file fails to process". If I use the dialog on the PDF Viewer and go to the exact same PDF file it opens correctly. Any idea what I am missing?

From Layout.cshtml:

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - TestPDFApp</title>
    <script src="~/js/site.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.2.619/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.2.619/js/jszip.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.2.619/js/kendo.all.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.2.619/js/kendo.aspnetmvc.min.js"></script>
    <script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="~/lib/kendo-ui/styles/kendo.common.min.css" />
    <link rel="stylesheet" href="~/lib/kendo-ui/styles/kendo.rtl.min.css" />
    <link rel="stylesheet" href="~/lib/kendo-ui/styles/kendo.bootstrap.min.css" />
    <link href="~/css/site.css" rel="stylesheet" />
</head>

From my View:

PDFViewer

answered on 27 Aug 2019