Telerik Forums
Kendo UI for Vue Forum
6 answers
465 views

I have started using the new Vue Native DropDownList and found a few issues when it is used inside a popup (bootstrap-vue modal).

 

The dropdown list will not display. I can make it display by adding:

.k-animation-container {
    z-index: 100000;
}

 

Now it displays but clicking out side the dropped down list will not close it.

 

Wayne

 

Wayne Hiller
Top achievements
Rank 1
Veteran
Iron
 answered on 13 Feb 2020
1 answer
84 views

Is their any documentation / demos available for formatting Kendo components with css?

Specially formatted data, e.g. negative numbers in red.

Petar
Telerik team
 answered on 12 Feb 2020
2 answers
1.0K+ views

I want to enable/disable a kendo combobox based on the user's selection from a checkbox, which I am storing in a variable.

I already tried setting the variable to the enable property, but this is useful only when the control is being built-in.

Does anybody know If I can do this while creating the control?

<div id="fund" class="col-xs-3"> input class="required" data-bind="title: $parent.selectedFund, kendoComboBox: { placeholder: 'Start typing to search...', value: $parent.test, widget: $parent.searchSource, dataTextField: 'managerName', dataValueField: 'managerId', filter: 'contains', autoBind: false, minLength: 3, enable: overrideGlobalMapping, //this does not work for me even though the variable holds the correct value change: function(){ if(this.value() && this.selectedIndex == -1){ setTimeout(function () {$parent.selectedManagerId(null);}, 100);}}, dataSource: { serverFiltering: true, transport: { read: $parent.retrieveManager }}}" /></div>

Delano
Top achievements
Rank 1
 answered on 08 Feb 2020
1 answer
312 views

Hello

I have a question about the tooltip function.

I've made a modification to Tooltip-Multiple Targets.

-remove width props
-Tooltip insertion for each language

https://www.telerik.com/kendo-vue-ui/components/popups/tooltip/multiple-targets/

If you hover over a long tooltip, it will appear properly, but if you check the short tooltip first and then try to see the long tooltip, the tooltip's width will be shortened.

Hopefully the width will be adjusted to auto.

 

<div id="vueapp" class="vue-app">
    <kendo-tooltip ref="kTooltip" id="agglomerations" :filter="'span'"  :position="'bottom'">
        <span href="#" title="방탄소년단·태연, '서울가요대상' 앨범·음원 대상…엑소 4관왕(종합)">Korean</span><br /><br />
        <span href="#" title="방탄" id="losangeles">Korean - Short</span><br /><br /> 
        <span href="#" title="Apple Music is available in iTunes, and for iOS and Android devices.">English</span><br /><br />
<span href="#" title="BTS" id="osaka">English - Short</span><br /><br />
        <span href="#" title="注文書、請求書などを装ったメールに添付された Excel ファイルに注意">Japanese</span><br /><br />
        <span href="#" title="注意" id="moscow">Japanese - Short</span>
    </kendo-tooltip>
</div>

Ivan Danchev
Telerik team
 answered on 03 Feb 2020
1 answer
160 views

Hi,

Is there a way to use Vue Templates (as per explain here: https://www.telerik.com/kendo-vue-ui/components/framework/vue-templates/#toc-using-single-file-components) for category labels in Kendo Charts ?

Because it does work with the Scheduler Event Template, but with the Chart all I can get is to print a div text (it is really print as his, not an empty div):

<div id="kendoGUID"></div>

CodeSandBox: https://codesandbox.io/s/vue-template-ddl-d2jhq

 

Thanks for your help !


Veselin Tsvetanov
Telerik team
 answered on 31 Jan 2020
1 answer
455 views

I am working on refactoring an old app from Angular 1.2 to Vue. 

I am using the Excel Export feature in the native grid successfully, however in the jQuery (and AngularJS) versions there is an "excelExport" event that we could hook into to modify the workbook prior to it being converted to an actual excel file. We were using this to conditionally apply background colors depending on the value of certain cells. 

Here is an example of our old code:

 

excelExport: function (e) {
            var sheet = e.workbook.sheets[0];
            var statuses = _.object(_.map($scope.dataSource.StatusId, function (x) { return [x.id, { name: x.name, color: x.color }] }));
 
            var statusCol = findExcelColumn(sheet, "Status");
            
            //find status column
            if (statusCol >= 0) {
                //Set status display with colours
                _.each(sheet.rows, function (row) {
                    var value = row.cells[statusCol].value;
                    if (!_.isUndefined(statuses[value])) {
                        row.cells[statusCol].background = statuses[value].color;
                        row.cells[statusCol].value = statuses[value].name;
                    }
                });
            }
        },

 

Is this something that is still possible to do? If not, is it a planned feature? 

Plamen
Telerik team
 answered on 28 Jan 2020
8 answers
226 views

There is a tabstip problem in ios 13.3. (iPad)

The tabstrip scroll icon is not clicked.

Click doesn't work so it's impossible to check the contents of the next tab.

Please confirm.

https://www.telerik.com/kendo-vue-ui/components/layout/tabstrip/scrollable-tabs/

Ivan Danchev
Telerik team
 answered on 22 Jan 2020
2 answers
180 views

Dear Telerik Forum Admins,

 

I would like to format the number columns within my excel export, but it seems that the format string that I am giving (which works in the Grid), is ignored by the saveExcel method when creating the excel. 

 

I attached a snippet of my code and how the same format string works in the Grid.

Could you please advise how I am able to format the numbers within my excel export.

 

Kind regards,

 

Natasha L

Natasha
Top achievements
Rank 1
 answered on 21 Jan 2020
1 answer
206 views
Hi,

I used Gantt Chart to show a number of jobs and related tasks to it but my requirement is to display multiple tasks related to one job should show in one row in gantt chart. Is this features supported by Gantt Chart?

 
Ivan Danchev
Telerik team
 answered on 17 Jan 2020
5 answers
137 views
I am using the grid wrap with a date type column, however when using the filter in that column, I send the value of the date in format: Wed Jan 08 2020 00:00:00 GMT-0400 (hora de Bolivia) how can i change the format?
Martin
Telerik team
 answered on 13 Jan 2020
Narrow your results
Selected tags
Tags
Grid
General Discussions
DropDownList
DatePicker
Editor
Grid wrapper
Scheduler
DropDownTree wrapper
Spreadsheet wrapper
Input
MultiSelect
Calendar
NumericTextBox
DateInput
DateTimePicker
Editor wrapper
DataSource wrappers (package)
Scheduler wrapper
Styling / Themes
Chart wrappers (package)
Gantt wrapper
Localization
Chart
Checkbox
ComboBox
Window
Pager
Error
Upload
DropDownList wrapper
Popup
Form
Tooltip
TreeView
Dialog
MultiSelect wrapper
NumericTextBox wrapper
Slider
Toolbar wrapper
Upload wrapper
Validator wrapper
ColorPicker
Accessibility
AutoComplete
AutoComplete wrapper
Button wrapper
ComboBox wrapper
ContextMenu wrapper
Licensing
ListBox wrapper
ListView wrapper
Map wrapper
MaskedTextBox
Menu wrapper
MultiColumnComboBox wrapper
Splitter wrapper
TabStrip wrapper
TimePicker
TreeView wrapper
TabStrip
Card
RadioButton
FloatingLabel
TextArea
Drawer
Stepper
DateRangePicker
Gauge
Splitter
PanelBar
Notification
RangeSlider
Menu
TreeList
Toolbar
Button
ListView
FontIcon
SVGIcon
Animation
Barcode wrapper
ButtonGroup wrapper
Chat wrapper
ColorPicker wrapper
DateInput wrappers (package)
Diagram wrapper
Dialog wrapper
Gauges wrappers (package)
MaskedTextBox wrapper
MediaPlayer wrapper
Notification wrapper
Pager wrapper
PanelBar wrapper
PivotGrid wrapper
QRCode wrapper
RangeSlider wrapper
ScrollView wrapper
Security
Slider wrapper
Switch wrapper
Tooltip wrapper
TreeList wrapper
TreeMap wrapper
Window wrapper
Avatar
StockChart
Sparkline
RadioGroup
Hint
Loader
ProgressBar
Switch
Wizard
Skeleton
ScrollView
ColorGradient
ColorPalette
FlatColorPicker
ButtonGroup
TileLayout
ListBox
ExpansionPanel
BottomNavigation
AppBar
Signature
ChunkProgressBar
VS Code Extension
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
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
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?