How to use the switch in a custom build?

3 posts, 0 answers
  1. Christopher
    Christopher avatar
    39 posts
    Member since:
    Jan 2017

    Posted 05 Jul Link to this post

    We were orginally using the "all" build of kendo UI for our application, but recently started using the the custom compilation Telerik provides with a gulpfile.

    We're using a mixing and matching components, using primary the non-mobile stuff, however, we do use the switch, but ever since we changed over to the custom build, we can not longer use the switch component, even though it's included in the build.

    It's probably some initialization code that we're not including, but we're not sure.

    When we try:

    $(element).kendoMobileSwitch( ... )

    we get:

    Uncaught TypeError: $(...).appendTo(...).kendoMobileSwitch is not a function

     

    Here's the gulp command we run to do the custom build:

    gulp custom -c autocomplete,binder,button,calendar,color,colorpicker,columnmenu,columnsorter,combobox,core,data,data.xml,dateinput,datepicker,datetimepicker,dialog,dom,draganddrop,drawing,dropdownlist,editable,excel,filebrowser,filtercell,filtermenu,fx,grid,groupable,imagebrowser,list,listbox,listview,maskedtextbox,mediaplayer,menu,mobile,mobile.application,mobile.button,mobile.collapsible,mobile.drawer,mobile.loader,mobile.scroller,mobile.scrollview,mobile.shim,mobile.view,mobile.switch,multiselect,notification,numerictextbox,ooxml,pager,panelbar,popup,progressbar,reorderable,resizable,responsivepanel,router,selectable,slider,sortable,spreadsheet,tabstrip,timepicker,timezones,toolbar,tooltip,touch,upload,userevents,validator,view,virtuallist,web,window

  2. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    561 posts

    Posted 07 Jul Link to this post

    Hi Christopher,

    Attached you will find a very simple Index.html page using the custom bundled scripts after executing the gulp command sent. You will notice, that the Switch widgets are properly initialized and rendered on the page.

    May I ask you to compare this output with your custom file (using a dif checker tool) and check if there are any differences? If the Switch part is missing, please, make sure, that the kendo.mobile.switch.js is present in your src/js folder at the time, when executing the gulp task.

    Regards,
    Veselin Tsvetanov
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Christopher
    Christopher avatar
    39 posts
    Member since:
    Jan 2017

    Posted 07 Jul in reply to Veselin Tsvetanov Link to this post

    Hi Veselin,

       Thanks, indeed our file was the same. It looks like the issue was our mistaken presumption of the AMD module definition (we're using require.JS). With the "all" kendo file, it was enough to simply require the "all" module and call it done. We presumed that everything in our generated script would bundle under the "kendo.web.min" module, because at first glance, that's where a bunch of the modules were bundled - however, we didn't notice the mobile AMD modules aren't bundled there.

       We required a the switch module manually ("kendo.mobile.switch.min") this time around, and it worked. 

      Thanks for the help, it put us on the right track.

Back to Top