Hi,

By using the Kendo validator on a modal window (kendo-window) containing some required fields, I've got this issue:

• I try to save everything without filling the fields, the validation messages will appear below the required fields, resizing the modal window;
• I fill a required field and then click the save button. This required field will lose its focus, triggering the validation event that will hide the validation message, thus resizing the window and because of that, the click event on that save button will not be fired because the button is not below the cursor anymore;

I saw that there is a validateOnBlur option that I need to be enabled but it is used only when the field lose its focus. Is there a way to fire the validation event while the user is typing or changing the field data? It would fix that problem because the modal window will be resized before the user can click on the save button.

I am using the VueJS Wrappers.

Thanks

Hi everybody,

I defined a window component with a onclick event in the template like that :

<window
        id="windowMD"
        :width="'300px'"
        :title="'Window title'"
        :actions="actions"
        :content="{
            url: 'http://localhost:3100/api/metadata',
            dataType: 'json',
            iframe: false,
            template:`
              <ul>
                # for (let i=0; i < data.mediaRequests.length; i++){ #
                    <li style='padding-bottom:5px;' onclick='#=eventClick(data.mediaRequests[i])#' > 
                      #= data.mediaRequests[i].id #
                    </li>
                # } # 
              </ul>
            `
        }"
    >
    </window>

But I have a problem when I click in a element in the list. I have a "the function is not defined" even if I declared it

[...]
methods: {
    eventClick: function(data) {
        console.log(data);
    }, 
  },
[...]

I see in this documentation that the function must be declared in the global scope but I need to use "$emits" to transfer data to parent component and I don't think it is possible in global scope. Even if it is possible, I have the same problem with the function ....

is there a solution to my problem ?

Hi All,

          We wish to start new project using Kendo UI and using Vue.Js. My requirement Listing Below

      In my application i had above 10 menus. When i click each menu it will load grid with data. When i login application it will land in default page with grid  and corresponding menu will be active. when i  click second menu i want to minimize  first grid data and load second grid data, when i click third menu again i want to minimize second grid data and load the third grid data. like that remaining  menus.  But when i click first or second or third minimized grid (not in menu) i want show that grid data . its will show only existing data(not going to data base and retrieve data). How will achieve this requirement using Kendo UI and vue.js? i don't  use session state kind of state management methods

 Hello,

I'm building a general modal component using the Window. Is it possible to pass a Vue component as template for a kendo Window?

Thanks!

I want to change the default options for some components, e.g all the window component in my app should to 400px width and 400px max-height. The way I use now is to create a component wrapper the kendo-window, but I must repeatedly define lots of kendo props in my component.

I also try to use Vue mixin like this

Vue.use(WindowInstaller,{
    title:'untitled'
})

But failed.

Any methods to be simpler? 

Hello,

I would like to call a component that contains only the custom edit template (to create a new task or edit) for my scheduler.

I followed this solution but the edit window just displays "[Object object]"

The code of scheduler

The code of the method editTemplate()

The code of the component that contains the custom template

I think the problem comes from the method editTemplate but I don't undestand why.

Anyone can help me ?

Thanks.

I have made a kendo grid using the following code:

                                <kendo-grid v-bind:data-source="getEscalations"
                                            v-bind:sortable-mode="'multiple'"
                                            v-bind:sortable-allow-unsort="true"
                                            v-bind:sortable-show-indexes="true"
                                            v-bind:height="250"
                                            v-bind:resizable="true"
                                            v-bind:sort="sortEscalationTable">
                                    <kendo-grid-column field="xxx" title="XXX">
                                    </kendo-grid-column>
                                    <kendo-grid-column field="yyy" title="YYY">
                                    </kendo-grid-column>
                                </kendo-grid>

the problem is that columns get misaligned when window is resized. I have to refresh the window to resize them again. Is there a flag or other way to keep them aligned on resize. Please take a look at the image. Thanks.

I am using SignalR, to add items to a sheduler datasource. 
when adding an appointment if someone is also on an appointment, close the window event, 
there is a way to update the agenda without closing the window event

Hi. I am looking at Kendo UI to fast track some dev , quite new to nodejs but I got it up and running with Vuetify.

https://nuxtjs.org/guide/installation/

Your instructions for installing are ok for a regular vue app , but I can't seem to integrate it into a Nuxt App.

I get "window is not defined" . Ideas?