I have to implement droppick select box in our project. I used the theme to add the main droppick js. So that I added the below code in ../app/design/frontend/Themename/newtheme/Magento_Theme/requirejs-config.js

var config = {
    map: {
        '*': {
            dropkick: 'Magento_Theme/js/dropkick'

then added the droppick.js file (main js to make work the droppick select box) in the path of .../app/design/frontend/Themename/newtheme/Magento_Theme/web/js

after that included the main css file (dropkick.css) for the droppick in the below path ../app/design/frontend/Themename/newtheme/web/css

and it's called via layout like below in theme ../frontend/Korla/Themename/Magento_Theme/layout/default.xml

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
        <css src="css/dropkick.css" />

Then I implement the droppick select box in my custom script

 require(['jquery','dropkick', 'jquery/ui'], function($){
//to implement the droppick select box for the configurable options select box

JS is called fine. But in the configurable product page, it's having some problem with the configurable options. Select box is not listing the options. I'm getting the below error

Uncaught TypeError: Cannot read property 'length' of undefined(…)configurable.js:395 

it comes from this line of code in configurable.js

for (i = element.options.length - 1; i >= 0; i--) {

How to solve this problem? Any help is appreciated...


You should move file requirejs-config to newtheme folder level.


Could you provide screenshot or url for review?. I can't reproducre your current state

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.