Telerik Forums
UI for ASP.NET MVC Forum
6 answers
693 views

Good morning,

I'm currently trying to get my donut charts to look flat with a bootstrap theme through the use of the kendo widget.  I've been taking a look at your documentation and came across the following property, and was hoping that it would be as simple as adding this to the end of the series object in the mvc widget ".Overlay.Gradient("none")"

http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-series.overlay

But to no avail, there is no such property, not according to the syntax highlighting, and it doesn't work when I try brute forcing the thing.  So I was wondering how to go about this using the syntax below.

@(Html.Kendo().Chart(Model)
    .Name("chart")
    .Title("Chart Data")
    .Legend(legend => legend
        .Position(ChartLegendPosition.Top)
    )
    .Series(series =>
    {
        series.Donut(
            model => model.Value,  // The data to use
            model => model.Category, // The category Name
            model => model.Color, // The color to use for the category
            null // How far out the donut section should pop out
        ).Padding(10)
        .Overlay.Gradient("none")
        ;
        //.Labels(labels => labels
        //    .Visible(true)
        //    .Position(ChartPieLabelsPosition.OutsideEnd)
        //    .Template("#= category # - #= kendo.format('{0:P}', percentage)#")
        //    .Background("transparent")
        //);
    })
    .Tooltip(tooltip => tooltip
        .Visible(true)
        .Template("#= category # - #= kendo.format('{0:P}', percentage) #")
    )
)

 

ITsolution
Top achievements
Rank 1
Iron
 answered on 27 Jul 2021
0 answers
353 views

Can you please guide me or show me how I can use the #displayFilters to be used with a header and footer and the footer continuing the page numbering. Currently the header and footer only displays with the grid pages and then it does a page-break with the filters with no styling. I’ve tried adding the styling but I don’t get the results I’m looking for. 
 

Another solution could be that it appends the displayFilters just after the grid without the page-break. 
below is my code for exporting: 
 
var grid = $("#grid").data("kendoGrid"); 

var root = new kendo.drawing.Group(); 

   
kendo.drawing.drawDOM($("#displayFilters")) 

.done(function (displayFilters){ 

               grid._drawPDF(progress) 

                    .then(function (root) { 

           

                        root.children.push(displayFilters); 

                        return kendo.drawing.exportPDF(root, { 

                            multiPage: true, 

                            allPages: true, 

                            avoidLinks: true, 

                       margin: { top: "3cm", left: "1cm", right: "1cm", bottom: "1cm" }, 

                            landscape: true, 

                            template: $("#page-template").html() 

                        }); 

                    }) 

                    .done(function (dataURI) { 

                        kendo.saveAs({ 

                            dataURI: dataURI, 

                            fileName: reportModel.Report.ReportName + ".pdf" 

                        }); 

                        progress.resolve(); 

                    }); 

            }); 
 
Here is my template:  

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

 

        <div class="page-template"> 

 

          <div class="header"> 

            <div style="float: left; width:33%;"><img src="./Content/Images/SB Logo.png" /></div> 

            <div id="reportName" style="width: 33%; height:100px; text-align:center; color: black; font-size:30px;vertical-align:middle;display:inline-block;padding-top:20px;">@ViewBag.Report.ReportName</div> 

            <div id="currentDate" style="float:right;width:33%; text-align:right; color: black; font-size:30px;padding-top:36px;display:inline-block;">23/07/2021</div> 

          </div> 

 

 

          <div class="footer" > 

            Page #: pageNum # 

          </div> 

 

        </div> 

</script>

Nolan
Top achievements
Rank 1
 asked on 26 Jul 2021
2 answers
300 views

Hello, I'm looking at the Stepper component e.g. (from a Telerik code sample and can't seem to find choices for icons.

I have looked at the documentation which points to web fonts but they don't seem right as I pasted in one or two of the icon names and get a blank step.

Thanks for any insight where to find a list of icon names to use in the Stepper.
@(Html.Kendo().Stepper()
        .Name("stepper")
        .Orientation(StepperOrientationType.Horizontal)
        .Label(Model.Label)
        .Indicator(Model.Indicator)
        .Steps(s =>
        {
        
            s.Add().Label("Begin").Icon("home");
            s.Add().Label("Second").Icon("attachment").Error(true);
            s.Add().Label("Third").Selected(true);
            s.Add().Label("Fourth").Icon("user");
            s.Add().Label("111");
            s.Add().Label("Done").Icon("save");
        })
    )

 

 

Karen
Top achievements
Rank 2
Iron
 answered on 23 Jul 2021
2 answers
168 views

Hi, I've got 2 dropdownlist dd1 and dd2. I need this functionality:

 

  1. First, both dd are enabled, each of them load all its items
  2. If user select value in dd1, we need to load in cascade dd2 with the corresponding values

Is this possible with the cascade functionality of the telerik dropdownlist?

 

Best regards.

PELAYO
Top achievements
Rank 1
Iron
 answered on 23 Jul 2021
1 answer
170 views
I am attempting to use a horizontal timeline to replace some legacy code.  As the timeline appears by default, only dates with no associated information is visible.  I would like to add some additional text, contained within the datasource, to the plotted datetime label.  Thank you.
Eyup
Telerik team
 answered on 23 Jul 2021
1 answer
378 views

I started a new project, and realized I no longer have the Kendo scaffolding options to select when adding "New Scaffolded Item".  I even open previous Kendo projects and did not see the options too.  I repaired the Telerik install and even tried reinstalling it.

I confirmed the Kendo UI Scaffolder is present under Extensions.

Framework is .NET 4.7.2 on Visual Studio 2019 Version 16.10.3

 

I'm not sure what else to do. Please help. thanks!

Misho
Telerik team
 answered on 23 Jul 2021
2 answers
162 views
I have modify the Radgrid and add custom drop down in the grid for filtering the data instead of text box. For the implementation I have follow the below link.
https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/how-to/Filtering/filter-with-ms-dropdownlist-instead-of-textbox-

Suppose there are some values in filter drop down as below :

1. [All]
2. Test OR Testing
3. RahulGoel

At initially [All] is selected in the filter drop down and all values are shown in the grid.
Now I select RahulGoel in the filter drop down,  After postback grid is filtered with that value and RahulGoel is selected in the filter dropdown.
Now If I select Test OR Testing in the filter drop down,  After postback grid shows whole data and is not filtered with that value and [All] is selected in the filter dropdown.

So the main problem with filter drop down is that, "If I select those values from filter drop down whose text contains 'OR' as a whole word, our filter is not working and whole grid is showing with [All] selected in filter drop down."

Is there any way to resolve the issue or this is an existing issue.
Rahul
Top achievements
Rank 1
Iron
 answered on 21 Jul 2021
1 answer
127 views

Hi 

I am using Kendo grid in asp.net mvc application, I have added Editable (incell) column in the grid, when I click on the editable column the column width is increasing. How to fix edit box width to column width.

column size before clicking on edit column

column size after clicking on edit column

 

Anton Mironov
Telerik team
 answered on 21 Jul 2021
0 answers
105 views

I have tried to implement a line chart along with Notes,. but the problem arises when 2 notes are very close to each other they overlap and are not readable. I tried adding margin but could not achieve a good result even with rotation it looks very absurd. 

I am trying to figure out a way where I can display the notes in one series alternatively top or down. But I can't find anything. I only got an option to display notes top or down per series. Need help with this?

Or if any other way I can achieve it with a readable format

Anubhav
Top achievements
Rank 1
 asked on 21 Jul 2021
1 answer
209 views
when I use .Groupable() in my grid it sorts the column that I have set to be grouped ascending by default. are there some parameters I can pass through to have it sort descending by default? Column names are variable so I cannot specify a by column name.
Anton Mironov
Telerik team
 answered on 20 Jul 2021
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
Upload
ComboBox
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
ListView (Mobile)
Pager
Accessibility
ColorPicker
DateRangePicker
Wizard
Security
Styling
Chat
MediaPlayer
TileLayout
DateInput
Drawer
SplitView
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Template
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
+? more
Top users last month
Edmond
Top achievements
Rank 1
Iron
fabrizio
Top achievements
Rank 2
Iron
Veteran
RobMarz
Top achievements
Rank 2
Iron
Fakhrul
Top achievements
Rank 1
Iron
Tejas
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Edmond
Top achievements
Rank 1
Iron
fabrizio
Top achievements
Rank 2
Iron
Veteran
RobMarz
Top achievements
Rank 2
Iron
Fakhrul
Top achievements
Rank 1
Iron
Tejas
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?