Как можно использовать методы пользовательского интерфейса Kendo в require js? - PullRequest
Новая
       38

Как можно использовать методы пользовательского интерфейса Kendo в require js?

0 голосов
/ 04 февраля 2020

Я хочу использовать Kendo UI drag and drop в моем проекте, используя require js, но он не нашел функцию, я не знаю, что не так в моих кодах: (((пожалуйста, найдите мне решение Это мой конфигурационный файл : 

requirejs.config({
    baseUrl : 'js' , 
    paths : {
        bootstrapBundle : 'libraries/bootstrap.bundle.min' , 
        bootstrap : 'libraries/bootstrap.min' , 
        jquery : 'libraries/jquery-3.4.1.min' , 
        customScroll : 'libraries/jquery.mCustomScrollbar.min' ,
        kendo : 'libraries/kendo2019.all.min' , 
        jsZip : 'libraries/jszip.min' ,
        controlesList : 'custom/ControlesList' , 
        dropInCol : 'custom/DropInColumn' , 
        dropInDropzones : 'customScripts/DropInDropzones'
    } ,  
    shim: {
        kendo: {
            deps: ['jquery'],
            exports: 'kendo'
        } 
    }
});

и это мои коды: 

define([
    'jquery' , 
    'jsZip' , 
    'kendo' ,
    // 'kendoDrop'
], function($ , jsZip , kendo) {

    window.JSZip = jsZip;
    var dropFunc = function(args){
        console.log('this : ' , args.this);
        console.log('kendo : ' , kendo.widgets[3].widget); // this returns kendoDropTarget widget in kendo ui js

        function dropzoneOnDragEnter(e){
            // console.log('drag enter');
            $(e.dropTarget).addClass('drt_dragEnter');
        }

        function dropzoneOnDragLeave(e){
            // console.log('drag leave');
            $(e.dropTarget).removeClass('drt_dragEnter');
        }

        function dropzoneOnDrop(e){
            // console.log('target : ' , e.target);
            $(e.dropTarget).removeClass('drt_dragEnter');
            var _targetId;
            var _place = $(e.dropTarget).attr('drt-place');
            var _row = $('<div>').addClass('row drt_row');
            var _col_12 = $('<div>').addClass('drt_col col-sm-12 col-md-12 col-lg-12');
            // _row.append(_col_12);

            if($(e.target).hasClass('drt_controlHint')){
                _targetId = $(e.target).attr('id');
            }
            else if($(e.target).parents('.drt_controlHint').length == 1){
                _targetId = $(e.target).parents('.drt_controlHint').attr('id');
            }

            if(_place != undefined){
                if(_place == 'first'){
                    args.data.find(x => {
                        if (_targetId && x.id == _targetId){
                            if(_targetId != 'drtRow'){
                                _row.append(_col_12.append(x.template)).insertAfter($(e.dropTarget));
                                // _row.find('> .drt_col').DropInColumn({data : [{test : 'nasrin'}] , newCol : true});
                                // createDropzones(_col_12);
                            }
                            else{
                                // console.log($(x.template).find('> .drt_col'));
                                // $(x.template).find('> .drt_col').DropInColumn({data : settings.data});
                                $(x.template).insertAfter($(e.dropTarget));
                                // createDropzones($(x.template).find('> .drt_col'));
                            }
                        }
                    });
                }
                else if(_place == 'last'){
                    args.data.find(x => {
                        if (_targetId && x.id == _targetId){
                            if(_targetId != 'drtRow'){
                                _row.append(_col_12.append(x.template)).insertBefore($(e.dropTarget));
                                // createDropzones(_col_12);
                            }
                            else{
                                $(x.template).insertBefore($(e.dropTarget));
                                // createDropzones($(x.template).find('> .drt_col'));
                            }
                        }
                    });
                }
            }
        }

        return $(args.this).kendoDropTarget({
            dragenter : function(e){
                dropzoneOnDragEnter(e);
            },
            dragleave : function(e){
                dropzoneOnDragLeave(e);
            } , 
            drop: function(e){
                dropzoneOnDrop(e);
            }
        });

    };

    return dropFunc;

});

В приведенном выше сообщении я получаю сообщение "DropInDropzones. js: 13 Uncaught ReferenceError: kendoDropTarget is notfined" в моей консоли

...