Questions on Kendo UI for Vue Forum

1 answer

137 views

ToolBarItem of type splitButton not reacting to updated Vue component state

So here's the dealio....

I have this really cool ToolBar on my site that has a splitButton ToolBarItem. It looks great. Does all the things. ❤️

This button has a :menu-buttons property which is full of nice items to show when a user clicks the down arrow on the button. It does that really well.

Then, the page state changes. You know, because stuff is happening on our super dynamic interactive web page! Well, because stuff changed, the :menu-buttons items that were there aren't really representative of the current state of the page. We need to update them to reflect the now state of thing.

But the splitButton ToolBarItem is not happy about this. It like the original list and no matter how much we poke or prod it, it's refusing to play nice and update itself. Suddenly we are sad 💔

Poor ToolBarItem. I wonder if there's anything she can do to pay attention to what's going on, or is she just stuck and not willing to listen?

Toolbar

answered on 09 Nov 2022

0 answers

294 views

@seriesclick is not calling the function

the below code works in stackblitz as expected but not in my local

<template>
  <div>
    <Chart
      :transitions="false"
      @seriesclick="notify"
    >
      <ChartTitle :text="'Gross domestic product growth GDP annual'" />
      <ChartLegend :position="'bottom'" :orientation="'horizontal'" />
      <ChartCategoryAxis>
        <ChartCategoryAxisItem :categories="categories" :start-angle="45" />
      </ChartCategoryAxis>
      <ChartSeries>
        <ChartSeriesItem
          v-for="(item, idx) in series"
          :key="idx"
          :type="'line'"
          :style="'smooth'"
          :data-items="item.data"
          :field="'value'"
          :note-text-field="'extremum'"
          :name="item.name"
        />
      </ChartSeries>
    </Chart>
    <Logger :title="'Events list'" :events="eventsList" />
  </div>
</template>
<script>
import {
  Chart,
  ChartSeries,
  ChartSeriesItem,
  ChartCategoryAxis,
  ChartCategoryAxisItem,
  ChartTitle,
  ChartLegend,
} from "@progress/kendo-vue-charts";
export default {
  components: {
    Chart,
    ChartSeries,
    ChartSeriesItem,
    ChartCategoryAxis,
    ChartCategoryAxisItem,
    ChartTitle,
    ChartLegend
  },
  data: function () {
    return {
      events: [],
      categories: [2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011],
      series: [
        {
          name: "India",
          data: [
            { value: 3.907, },
            { value: 7.943 },
            { value: 7.848 },
            { value: 9.284 },
            { value: 9.263 },
            { value: 9.801 },
            { value: 3.89 },
            { value: 8.238 },
            { value: 9.552 },
            { value: 6.855 },
          ],
        },
        
         
        
      ],
    };
  },
  computed: {
    eventsList(){
      return this.events;
    }
  },
  methods: {
    onRender() {
      this.events.unshift("Render event triggered");
    },
    
    notify() {
      alert();
      this.events.unshift("SeriesClick event triggered");
    },
   
  },
};
</script>

Chart

asked on 04 Nov 2022

1 answer

144 views

Tooltip in Layers

Hello, Exists any way to show a tooltip in the bubble layers?
Thanks in advance

Map wrapper

answered on 20 Oct 2022

0 answers

326 views

Create filter label with close event

Hi everyone! , I would like to create at the select of a grid a label at the top of the page with a click button to cancel the decision. Something that looks like a filter on shopping websites. Something like attached in the picture Does a similar component already exist?

asked on 20 Oct 2022

0 answers

389 views

Kendo Grid - Change Color Row Selected

How to change color of row selected?

Grid

asked on 20 Oct 2022

0 answers

316 views

Template column with the wrapper?

I'm using the Grid Wrapper, I can't for the life of me figure out how to do a template column?

..or like binding to a WCF date to convert to something readable

**EDIT**

Got it with the column data API bindings

Grid wrapper

updated question on 19 Oct 2022

0 answers

252 views

Change title for Filters

Hi I have a grid using: https://www.telerik.com/kendo-vue-ui/components/grid/filtering/filter-menu/

I have several filters by columns, how can I change the title?

In the image you can see my grid, for example in the first filter I need the title to be different from the second, how is this possible?

Grid

asked on 17 Oct 2022

1 answer

135 views

How do you databind selected items in the ListBox Control?

I have been able to successfully bind a Vue ref array to the first listbox control's data-source property successfully. I am also able to use the toolbar controls to move items back and forth between two listbox controls. I am not able to bind a Vue ref array for selected items on the second listbox control. I am also unable to get the "add" and "remove events to invoke my handler functions. Please advise on how to get the selected values that are present in the second listbox control. In the example below, how do I get "Name 2" out of the second listbox control?

Thank you for your help

ListBox wrapper

answered on 28 Sep 2022

1 answer

122 views

Locked Expand Field

Hello.

I implemented the kendo ui grid vuejs.

I have a question, how it's possible "sticky" the Expand column?

I have other columns "sticky" and works fine, but the "expand" column (master details) don't keep sticky. and i need to hide the "menu filters" in this columns too

Thanks in advance

Grid

answered on 20 Sep 2022

1 answer

219 views

Autohide of notification from kendo-vue-notification

Hi,

I want to use new notification Vue Notification Component & Overview | Kendo UI for Vue Docs & Demos (telerik.com) from kendo-vue-notification package. How I can implement autohide feature? I need to show the result of a operation but user doesn't have to close notification.

Thanks

Pavel

Notification

answered on 14 Sep 2022