Clear action button is not working, and this seems to happen only when the component is in controlled mode.

Here is an example showing the issue: https://stackblitz.com/edit/4n8dnh?file=src/main.vue

I want to collapsible splitter for custom button.

not splitbar.

How can collaspe control Splitter to custom button?

Currently I'm using the Kendo native grid component and I want to make use of the master-detail template functionality:

https://www.telerik.com/kendo-vue-ui/components/grid/custom-rendering/hierarchy/

However when enabling this the expand buttons are always on the left column and I can't change the styling easily. 

Is it possible to make a custom expand button via the use of a function or something that will also open each row's detail template?

I'm trying to export the html generated by the Kendo Vue Native Editor to a PDF document, using the Kendo Vue Native PDF Processing (I'm not using the Editor's embedded pdf export button, because I need to send this PDF to the backend).

I can't see any documentation about how to this. This is what I first tried:

const iframe = document.querySelector(".k-editor-content .k-iframe");
      const htmlElementContent = iframe.contentWindow.document.querySelector("html")

      savePDF(htmlElementContent, {
        paperSize: "A4"
      });

But then I got this error: "DOMException: Failed to execute 'insertBefore' on 'Node': Only one element on document allowed."

To bypass this error, I tried to manipulate the Iframe content first:

const iFrameDocument = document.querySelector(".k-editor-content .k-iframe").contentWindow.document;
      const iFrameRootHtml = iFrameDocument.querySelector("html")
      const newSection = iFrameDocument.createElement('section');
      newSection.appendChild(iFrameRootHtml);
      iFrameDocument.appendChild(newSection);

      const newRoot = newSection.querySelector("html");

      savePDF(newRoot, {
        paperSize: "A4"
      });

With the above code I'm able to generate an PDF, but with no embedded fonts at all. Also, if I try to drag an image into the editor (the editor transforms it into a base64 string) and then generate the PDF, I got this error: "DOMException: Failed to execute 'appendChild' on 'Node': Only one element on document allowed."

Still regarding the fonts, I'm declaring them in the style section of the html that is inside the iframe content, using the onLoaded event of the Editor (https://www.telerik.com/kendo-vue-ui/components/editor/styling-content/). I'm also declaring them on the outer content (the main website). The fonts are hosted on my own website. Still, no embedded fonts on the generated PDF.

Also, to the Telerik forum admins, I just noted that there is no tag available neither for the Native Editor or the native PDF Processing, so I'm forced to tag this question with wrong/generic tags.

Any help will be appreciated, thanks in advance.

I have below item in my 'columns' in 'data' function of my grid component. How can I write it in <kendo-grid-column> tag format?

I also need my isActive to render as a radio button all the time. Please help with these 2 things.

{ cell: "myTemplate", filterable: false, width: "210px" }

This is what I have so far. It display all columns except my v-slot.

<grid :style="{ height: '300px', width: '60%' }"

Hi All,

         How can we create , show , hide button in grid using vue js

Hi,

I have the native grid set up in my vue application with Vuex and having issue getting the grouping feature to work.

I am not getting a response whenever I drag a column to the column header. The dragged column just not stay in the column header, it disappears afterward.

It seems my grid isn't emitting the onDataStateChange method. Not sure what I have done wrong.

Other gird features are working fine. 

I'm trying to manually add an item to my grid's datasource, and can't seem to get it to work, but I may just be missing something fundamental with Vue components.

My grid is located in a child Vue component template, where the datasource is given to it by the parent (it's an array of objects).  When it binds, it does display my two sample rows from the array, but can't get a new row to be added dynamically.

Grid:

                    <kendo-grid v-once ref="diagnosisCodes" :data-source="dataSource.DiagnosisCodes" :selectable="true" :scrollable="false">
                        <kendo-grid-column field="SequenceNumber" title="@Localizer["Sequence"]" :width="100"></kendo-grid-column>
                        <kendo-grid-column field="DiagnosisCode" title="@Localizer["Diagnosis Code"]" :width="140"></kendo-grid-column>
                        <kendo-grid-column field="Description" title="@Localizer["Description"]"></kendo-grid-column>
                        <kendo-grid-column :command="['destroy']" title="&nbsp;" :width="120"></kendo-grid-column>
                    </kendo-grid>

In a method of my child component, I'm basically trying to do this, just to see if I can get a new row to appear in the grid:

                    const dc = <Vue>this.$refs.diagnosisCodes;

                    const item: any = { SequenceNumber: 3, DiagnosisCode: "M225.7", Description: "Fingers crossed" };

                    dc.$props.dataSource.push(item);

The console error is attached, but the error is "[Vue warn]: Error in callback for watcher "dataSource": "TypeError: dataSource.fetch is not a function".  I'm new to using Kendo Vue, so if I'm doing this wrong, how can I dynamically add to my Vue grid datasource, in order to get new rows to appear?

How can i refresh grid datasource by button event.

I want to display data in certain time that user push the button.

How can i handling grid refresh event?

Hello,

In my grid in the columns I put custom colum menu, so I can use directly the filters. The problem is that although everything seems to be working fine, when I click on on column filter it opens a popup, and when I click on one other columns filter it also opens a popup BUT does not close the previous one.

I ve seen examples where this functionality works, and some others that it does not. Is there a solution for when I open one columns filter popup to close all the others that is currently open?

Thanks