Telerik Forums
Kendo UI for Vue Forum
0 answers
16 views

Using Vue Wrapper for the Dropdowns

I have a multiselect in a v-for, it's rendering 3 widgets.

                                <kendo-multiselect :data-source="t.Items"
                                                   class="w-100"
                                                   :data-text-field="'Value'"
                                                   :height="300"
                                                   :value-primitive="false"
                                                   v-model="t.Selected"
                                                   :filter="'contains'"
                                                   :change="onKendoChange('multiselect')"
                                                   :placeholder="'- Select -'">
                                </kendo-multiselect>

 

When the page loads, all 3 of these fire their change event twice, so if I console log, I get 6 events. Ideally I don't want anything to happen on mount\load... just once the selection changes.

But then in the onKendoChange function, if I change ONE of the multi-selects, it's firing 3 more events, not just the event once for that one widget.

Basically I need to re-call my "getdata" function anytime something is selected...

Running 2023.3.1010

Steve

sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
 updated question on 29 Feb 2024
1 answer
25 views

Hello,


I'm trying to get the Kendo Vue Editor to be able to accept pasted content from a Google Doc. 
However when trying to copy paste from there the text in the clipboard is wrapped in a <b style="font-weight: normal"> tag.

This is a known issue for the ProseMirror devs and they have a fix for it. 
Simple Copy Paste from google docs yields bold text · Issue #459 · ProseMirror/prosemirror (github.com)

If you try the editor example on ProseMirror.com you can safely paste text from Google Doc and it won't be converted to <strong>:
ProseMirror basic example

It seems it's able to do so correctly because of this ProseMirror schema change:
Don't treat <b style=font-weight: normal> as strong · ProseMirror/prosemirror-schema-basic@cbbdc1a (github.com)

prosemirror-schema-basic/src/schema-basic.ts at master · ProseMirror/prosemirror-schema-basic (github.com)


However when I try to load this schema-basic schema it doesn't work as intended and Google Doc text is still converted to <strong> text

Here is my attempt so far:
Yrawzh (forked) - StackBlitz

 

What's the best way to fix this issue?

Vessy
Telerik team
 answered on 28 Feb 2024
1 answer
38 views

Hello, I have a question about the rowResizing feature.

Is the rowResizing feature available in ProseMirror when creating tables with the Editor?
If ProseMirror doesn't support rowResizing, is there a way to implement this feature?

Vessy
Telerik team
 answered on 27 Feb 2024
1 answer
31 views

Hello forum,

can the Listview component be sortable and draggable? I would like to influence the order of the displayed Listview entries with the mouse. I would appreciate any feedback. Best regards

Konstantin Dikov
Telerik team
 answered on 20 Feb 2024
1 answer
37 views

Hello , I would like to add a class to the ChartSeriesItem,  the hand cursor pointer :


This is my code :

Chart.m-4.p-5#range-bar-chart( @seriesclick="onSeriesClick" :style="{ height: getChartHeight() }")
  ChartTooltip(:render="'tooltipRender'" background="#fff" color="#000" position="left")
    template(v-slot:tooltipRender="{ props }")
      .d-flex.align-items-center.flex-column.tooltip-content
        h6.font-weight-bold.text-center.tooltip-category-title {{ props.point.category }}
        .d-flex.align-items-center
          span {{ $t('home.rangeBarChart.date.start') }} :
          span.font-weight-bold.ml-1 {{ labelContentFrom(props.point)}}
        .d-flex.align-items-center
          span {{ $t('home.rangeBarChart.date.end') }} :
          span.font-weight-bold.ml-1 {{ labelContentTo(props.point)}}
  ChartTitle( v-if="chartTitle && chartTitle !== ''"  :text="$t('home.rangeBarChart.'+ chartTitle + '.title' )"  align='left' color='#475467' :font="'600 16px Inter'")
    ChartCategoryAxisItem( :categories="categoriesValues" :major-grid-lines='{visible: false }' :margin=10 :font="'600 14px Inter '" )
  ChartCategoryAxis
    ChartCategoryAxisItem( :major-grid-lines='{visible: false }' :categories="categoriesValues" :margin=10 :font="'600 14px Inter '" :labels="{visible: true, visual: getYAxisLabels}")  
  ChartValueAxis
    ChartValueAxisItem(
    :major-grid-lines="{visible: false }" 
    :crosshair="{visible: false }" 
    :min="valueAxisObj.min" 
    :max="valueAxisObj.max" 
    :fromField="'min'" 
    :toField="'max'"
    :font="'600 14px Inter '"
    :rotation="'auto'" 
    :labels="{ visual: getTimeLabels}"
    )    
  ChartSeries
    ChartSeriesItem(:type="rangeBarType", :data-items="myDataItemsComputed"  :category-field="'phase'" :font="'600 14px Inter '" :color="barItemColor"  )
      ChartSeriesLabels
        ChartSeriesLabelsFrom(:content="labelContentFrom" )
        ChartSeriesLabelsTo(:content="labelContentTo")  

 

Konstantin Dikov
Telerik team
 answered on 09 Feb 2024
0 answers
25 views

Hello, may I ask how to merge the red boxes in the picture?

Pan
Top achievements
Rank 1
Iron
 asked on 01 Feb 2024
0 answers
31 views

Hello,

Is there a way to have multiple validators on a field, like a require validator that check if the field is not empty and another that check if the field is a URL for example.

I tried to setup the validator parameter like this without success:

:validator="[requiredValidator, urlValidator]"

Regards,

Fabien

SysCo
Top achievements
Rank 1
Iron
Iron
 asked on 30 Jan 2024
1 answer
28 views

Currently using ComboBox, When you select it and a drop down appears, I see you are using Teleport and appending it to the end of the body.

Are you able to either:

  1. Set a prefix for kendo to use on all its CSS classes as to stop vendor conflicts (using other kendo ui products in ASP for example) OR
  2. Choose which element Kendo uses for its teleports.
Filip
Telerik team
 answered on 27 Jan 2024
1 answer
87 views

Is it possible to prevent the user from clicking (selecting) a parent node, but still allow selection of any children. Or ideally change the behaviour of the parent node to expand / collapse the node. The current behaviour of the DropDownTree is that all children are selected, and I don't want this, only a single (child)node  should be selectable

So in the example below, the user can select on Apple, Orange etc, but not Fruit / Vegetable 

- Fruit
- Apple
- Orange
- Peach
- Vegetable
- Spinach
- Beans
etc

 

Konstantin Dikov
Telerik team
 answered on 24 Jan 2024
1 answer
41 views

I have the native TreeView component and I am wanting to scroll a pre-defined node into view. I do not see any methods available on the component that allows me to do so, and I do not see any documentation around this particular issue.

Outside of me using DOM selectors to find the node and force the container of the tree to scroll to it, does Kendo provide a method or guide for how to achieve this?

Konstantin Dikov
Telerik team
 answered on 22 Jan 2024
Narrow your results
Selected tags
Tags
Grid
General Discussions
DropDownList
Grid wrapper
Editor
DatePicker
DropDownTree wrapper
Scheduler
Spreadsheet wrapper
Input
Editor wrapper
MultiSelect
DateInput
NumericTextBox
Scheduler wrapper
Styling / Themes
Calendar
DataSource wrappers (package)
Chart
Chart wrappers (package)
DateTimePicker
Gantt wrapper
Localization
Pager
Checkbox
Upload
DropDownList wrapper
Window
Error
Form
Tooltip
TreeView
ComboBox
Dialog
MultiSelect wrapper
NumericTextBox wrapper
Popup
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
FloatingLabel
TextArea
Drawer
Stepper
Gauge
Splitter
PanelBar
Notification
RangeSlider
Menu
TreeList
Toolbar
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
RadioButton
RadioGroup
Hint
Loader
ProgressBar
DateRangePicker
Switch
Wizard
Skeleton
ScrollView
ColorGradient
ColorPalette
FlatColorPicker
Button
ButtonGroup
TileLayout
ListBox
ExpansionPanel
BottomNavigation
AppBar
Signature
ChunkProgressBar
VS Code Extension
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?