Telerik Forums
UI for ASP.NET Core Forum
0 answers
320 views

Hi..All

After I convert my metronic themes using import bootstrap themes, I got many css file (ex :  Button.Metronic.css Calendar.Metronic.css, ComboBox.Metronic.css etc etc...)

But how I load those css file to change the default css and how to use it ?, let say i am want to change the default themes for button into my metronic themes.

Thanks

Jigu

 

 

 

 

Jigu
Top achievements
Rank 1
 asked on 07 Dec 2016
3 answers
256 views

Hello,

 

I'm working on a project at ASP.NET Core, using Kendo UI Pivot Grid with AngularJS. I have a Pivot Grid table and I'm saving/loading data on an SQL Server as reports for it successfully. I have a "details" page, where the data are loading and the table appears, but it's not editable. Up till now everything is ok. Now I'm trying to export the data as Excel and PDF formats and after I've tried every method that I have found, I had no results... Please, tell me what I'm doing wrong, or what I forget!

 

My code follows: 

HTML

@*Below I initialize my data via ng-init. I had to convert them from SQL first. Below there are the 2 buttons for export. Then the table appears*@
<div id="Details" class="form-group">
        <div ng-app="PivotGrid" ng-controller="PivotGridShow" data-ng-init="init(@Newtonsoft.Json.JsonConvert.SerializeObject(Model))" >
                <div class="pull-right">
                    <button id="exportexcel" class="k-button k-button-icontext hidden-on-narrow"><span class="k-icon k-i-excel"></span>Export to Excel</button>
                    <button id="exportpdf" class="k-button k-button-icontext hidden-on-narrow"><span class="k-icon k-i-pdf"></span>Export to PDF</button>
                </div>
        <div kendo-pivot-grid k-options="options" k-data-source="dataSource" id="pivotgrid" class="hidden-on-narrow" style="width:100%; height:100%;"></div>
        <div class="responsive-message"></div>
    </div>
</div>
<style>
    .hidden-on-narrow {
        display: inline-block;
        vertical-align: top;
    }
</style>

 

JS (script for the PivotGrid)

angular.module('app.splitter-panel', ['Kendo.directives']);
angular.module('app', ['app.splitter-panel']);
angular.module("PivotGrid", ["kendo.directives"])
 
    .controller("PivotGridShow", function ($scope) {
 
        $scope.init = function (report) {
            $scope.columns = report.ReportLayoutColumns;
            $scope.rows = report.ReportLayoutRows;
            $scope.measures = report.ReportLayoutMeasures;
            $scope.dataSource = loadDataSource();
            $scope.options = {
                excel: {
                    fileName: "Report.xlsx",
                    allPages: true,
                    filterable: true,
                    proxyURL: "http://demos.telerik.com/kendo-ui/service/export"
                },
                pdf: {
                    author:"Retail-Link",
                    date:new Date(),
                    fileName:"Report.pdf",
                    landscape:false,
                    margin:{
                        left: 10,
                        right: "10pt",
                        top: "10mm",
                        bottom: "1in"
                    },
                    paperSize: "A4",
                    proxyURL: "http://demos.telerik.com/kendo-ui/service/export"
                },
                filterable: true,
                sortable: true,
                columnWidth: 100,
                height: 800,
                dataSource: $scope.dataSource,
                dataBound: function (e) {
                    document.getElementById('measures').value = JSON.stringify(e.sender.options.dataSource._measures);
                    document.getElementById('rows').value = JSON.stringify(e.sender.options.dataSource._rows);
                    document.getElementById('columns').value = JSON.stringify(e.sender.options.dataSource._columns);
                }
            };
        };
 
        function loadDataSource() {
            var PivotGrid = new kendo.data.PivotDataSource({
                type: "xmla",
 
                columns: JSON.parse($scope.columns),
                rows: JSON.parse($scope.rows),
                measures: JSON.parse($scope.measures),
 
                transport: {
                    connection: {
                        catalog: "Adventure Works DW 2008R2",
                        cube: "Adventure Works"
                    },
                    read: {
                        url: "http://demos.telerik.com/olap/msmdpump.dll"
                    }
                },
                schema: {
                    type: "xmla"
                },
                error: function (e) {
                    alert("error: " + kendo.stringify(e.errors[0]));
                }
            });
            return PivotGrid;
 
//Below there are my last two tries for the buttons
 
            $scope.exportexcel = function () {
                PivotGrid.saveAsExcel();
            }
 
            $("#exportpdf").click(function () {
                PivotGrid.saveAsPDF();
            });
 
        }
    });

 

This is what I include

<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="~/lib_bower/metisMenu/dist/metisMenu.min.js"></script>
<script src="~/lib_bower/pace/pace.min.js"></script>
<script src="~/lib_bower/slimScroll/jquery.slimscroll.min.js"></script>
<script src="~/lib_bower/angular/angular.min.js"></script>
<script src="angular-animate.min.js"></script>
Daniel
Telerik team
 answered on 06 Dec 2016
2 answers
158 views
I have a RadDatePicker inside of a Form Template.  I can access the dbselected value from code behind, though I want to take the month and day of the dbselected value and populate an asp:textbox with the month, and a RadNumericTextBox with the day.

 

The structure is

1. RadGrid

2. MasterTableView

3. EditFormSettings

4. Form Template

5. Then tables/rows/cells containing labels, textboxes, etc.

 

From code behind I can access all the asp and telerik items in the tables and retrieve any data for further use in my application by using the following code:

 

If e.CommandName = RadGrid.UpdateCommandName Then
            If TypeOf e.Item Is GridEditFormItem Then
                Dim item As GridEditFormItem = DirectCast(e.Item, GridEditFormItem)
                Dim theClient As TextBox = DirectCast(item.FindControl("txtClient"), TextBox)
                Dim theOrder As TextBox = DirectCast(item.FindControl("txtOrder"), TextBox)
              
  Dim theRadDateOrder As RadDatePicker = DirectCast(item.FindControl("RadDatePickerOrderDate"), RadDatePicker)

                etc.


I now have the value from the dbSelectedDate:

                Dim theDateOrderDate As DateTime = theRadDateOrder.DbSelectedDate
                Dim theDateOrderMonth As String = theDateOrderDate.ToString("MMMM")
                Dim theDateOrderDay As String = theDateOrderDate.Day

And I now have a month and I have a day broke out.

Now within the form template is an asp:textbox that I want to update/insert/place the month value into.  I also have  a RadNumericTextBox that I want to update/insert/place the day value into.

What I want to do is update the month and day on the form when the date is selected with the RadDatePicker.

All the above was figured out by searching the internet and putting the pieces together. 

I have not been able to find even a starting point on my question, it may be in the above code, but I do not see it yet.

My question is how do I do this from code behind as I cannot access the controls directly as they are within the Form Template?

 

Thank you for your time.  Dale

 

 

Dale
Top achievements
Rank 1
 answered on 02 Dec 2016
1 answer
152 views

Previously the Telerik Control panel would update the asp core nuget package when I upgraded via the control panel (I originally purchased the MVC suite prior to ASP Core being a separate product).  As of the last update or so the core nuget package is not installed and I have to go to the download page at Telerik to get it via the independent installer.  Am I doing something wrong or is the MVC Core package not available through the control panel?

 

 

Nikolay Mishev
Telerik team
 answered on 30 Nov 2016
1 answer
216 views

I just upgraded my MVC ASP.NET Core project from Visual Studio 2015 to 2017...I have been using it for the past couple of days...and now this item shows in my Error List....Do you know what this means or how it can be resolved?

SeverityCodeDescriptionProjectFileLineSuppression State
ErrorFailed to retrieve information from remote source 'https://nuget.telerik.com/nuget/FindPackagesById()?id='Microsoft.NET.Sdk.Web''.
Response status code does not indicate success: 401 (Please provide Authorization headers with your request.).0

 

Thanks,

Les

Nikolay Mishev
Telerik team
 answered on 23 Nov 2016
2 answers
138 views

Microsoft just released 1.1 for Core and EntityFrameworkCore.

 

Just wanted to check if UI for Core is compatiable ?

 

any known issues?

 

Rumen
Telerik team
 answered on 23 Nov 2016
5 answers
233 views

A couple of items:
1. Can a separate Thread/Topic for "MediaPlayer" be set up  in "aspnet-core-ui"?
2. I find that the Source does not appear to work...(ie. localhost under  wwwroot)

   I have tried the following variations in the code below (the source to youtube works) ... any recommendations?

                .Source( "assets/Videos/MyVideo.mp4")  

                .Source( "~/assets/Videos/MyVideo.mp4")  

                .Source( "~assets/Videos/MyVideo.mp4")  

    @(Html.Kendo().MediaPlayer()
            .Name("mediaPlayer")
            .AutoPlay(true)
            .Navigatable(true)
            .Media(m => m
                .Title("Recap of Progress Ringing The Bell at Nasdaq (2016)")
                .Source( "~/assets/Videos/MyVideo.mp4")            
            )
            .HtmlAttributes(new { style = "height:360px" })
            .Deferred()
    )

Eyup
Telerik team
 answered on 22 Nov 2016
1 answer
108 views

We are trying to add extra data to a grid via an onscroll listener.
This works when the data is filtered or sorted, but not when grouped.
Below is the code we currently have that is called when new data is needed.

 

var grid = $("#grid").data("kendoGrid");
var parameterMap = grid.dataSource.transport.parameterMap;       
var requestObject = parameterMap({ aggregate:grid.dataSource.aggregate(),sort: grid.dataSource.sort(), filter: grid.dataSource.filter(), group: grid.dataSource.group(), page: pagina, pageSize:grid.dataSource.pageSize() });

$.post('@Url.Action("GetAllOffers_Post", "Offer")', requestObject, function (response) {
           try {
                grid.dataSource.pushCreate(response.Data); //Works for non-grouped data
            } catch (err) {
                console.log(err);
                try {

                    //Data is grouped when we end up here
                    //var data = grid.dataSource.schema.parse(response.Data);
                    //Array.prototype.push.apply(grid.dataSource.options.schema.groups, response.Data); //API said we could use the schema.parse but that doesn't work nor does the schema.groups since grid.dataSource.schema doesn't exist
                } catch (errortwee) {
                    console.log(errortwee);
                }
            }

Ianko
Telerik team
 answered on 17 Nov 2016
1 answer
1.5K+ views

I have basically copied the demo on your site...but I get the following error...any recommendations?

My grid populates, but when I press the Export To Excel button in the grid, nothing happens...

When I inspect my browser I get the following:
SCRIPT5022: JSZip not found. Check http://docs.telerik.com/kendo-ui/framework/excel/introduction#requirements for more details.
kendo.all.js (11412,31)

-------------------------------

I have tried adding the following suggestion from the link, but that does not work

JSZip
To take full advantage of the Excel export feature, download the JSZip library and include the file before the Kendo UI JavaScript files, as shown below.
EXAMPLE
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script><script src="http://cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.js"></script><script src="http://kendo.cdn.telerik.com/2016.3.1028/js/kendo.all.min.js"></script>
JSZip is part of the Kendo UI distribution and is also available via the Kendo UI CDN:
<script src="http://kendo.cdn.telerik.com/2016.3.1028/js/jszip.min.js"></script>

 

 

------------------------------

@model IEnumerable<Areas.Name.Models.TransactionName>

<h2>Grid</h2>

@(Html.Kendo().Grid<Areas.Name.Models.TransactionName>()
        .Name("grid")
                .Columns(columns =>
                {
                    columns.Bound(c => c.LastName);
                    columns.Bound(c => c.FirstName);
                    columns.Bound(c => c.MiddleName1);
                })

        .BindTo(Model)
        .ToolBar(tools => tools.Excel())
        .Excel(excel => excel
            .FileName("Products.xlsx")
        )
        .Deferred()
        )

@* All initialization scripts are rendered to the bottom of the page, see Layout.cshtml *@
@section scripts {
    @Html.Kendo().DeferredScripts()
}

Kiril Nikolov
Telerik team
 answered on 14 Nov 2016
1 answer
213 views

Hi,

I'm trying to change the format  for the filter for a date  (datepicker in the filterRow  from  "MM/d/yyyy"   to "yyyy-MM-dd"

I attached  a screenshot of the result I'm getting

The filter format is "MM/d/yyyy"    and my column format is "yyyy-MM-dd" (set by .Format("{0:yyyy-MM-dd}") )

 

I want the format to be same for both filter  and column data  -  i.e "yyyy-MM-dd"

Column options:
 
 columns.Bound(c => c.DateInvitation)
             .Title("Date invitation/rappel")
             .Format("{0:yyyy-MM-dd}")
             .Width(150)
             .Filterable(f => f.Cell(c => c.ShowOperators(false).BindTo(Enumerable.Empty<string>())));
 
grid options:
 
 .Filterable(ftb => ftb.Mode(GridFilterMode.Row)).Filterable()

Marin
Telerik team
 answered on 11 Nov 2016
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?