Robdel12 / DropKick

A JavaScript plugin for creating beautiful, accessible, and painless custom dropdowns.

Home Page:http://dropkickjs.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

issue with e.offsetTop

artknight opened this issue · comments

Here is the code that generates the error:

position: function(e, t) {
            for (var s = {top: 0,left: 0}; e !== t; )
                s.top += e.offsetTop, s.left += e.offsetLeft, e = e.parentNode;
            return s
}

error: Uncaught TypeError: Cannot read property 'offsetTop' of null

Suggestion: add a check to make sure "e" is not null.

Thanks,

Can you provide an example that caused this error?

OK, here is a code snippet that I modified off of the original example that was provided on your example page. You could probably say that "its my custom code" so no guaranties ... which is correct.. but the issue is in the main lib. My work-around for this was to add a check whether e is null or not but I had to do it within the dropkick.js and as soon as you released a new update it got overwritten. So, I am just humbly asking to add the check to the main lib so that i do not have to do any manual work later on. And it will not harm anything in drokick.js any ways.

=== code snippet ===

searchDropdown: function(options){
        var options = _.extend({},options),
            keys = { UP:38, DOWN:40 };

        //must add .search-select class for proper styling
        this.addClass('search-select');

        return this.dropkick({
            mobile: true,
            initialize: function(){
                var $input,
                    dk = this;

                    dk.temp = {
                        found: dk.options,
                        lastSelectedIndex: dk.selectedIndex || 0
                    };

                $('.dk-selected',dk.data.elem).after('<div class="dk-search"><input type="text" class="dk-search-input" placeholder="Search"></div>');
                $input = $('.dk-search-input',dk.data.elem);
                $input.on("click",function(event){
                    event.stopPropagation();
                }).on('keypress keyup', function(event){
                    event.stopPropagation();
                    var keyCode = UTILS.getCharKey(event);

                    if (keyCode===keys.UP){
                        dk.temp.lastSelectedIndex--;
                        (dk.temp.lastSelectedIndex < 0) && (dk.temp.lastSelectedIndex = 0);
                        dk.selectOne(dk.temp.found[dk.temp.lastSelectedIndex]);
                    }
                    else if (keyCode===keys.DOWN){
                        dk.temp.lastSelectedIndex++;
                        (dk.temp.lastSelectedIndex > dk.temp.found.length-1) && (dk.temp.lastSelectedIndex = dk.temp.found.length-1);
                        dk.selectOne(dk.temp.found[dk.temp.lastSelectedIndex]);
                    }
                    else {
                        dk.temp.found = dk.search(this.value, dk.data.settings.search);
                        dk.temp.lastSelectedIndex = 0;

                        $('.dk-option', dk.data.elem).remove();
                        if (dk.temp.found.length){
                            $(dk.temp.found).appendTo(dk.data.elem.lastChild);
                            dk.selectOne(dk.temp.found[0]);
                        }
                        else
                            $('<li></li>').addClass('dk-option dk-option-disabled').text('Not Found').appendTo(dk.data.elem.lastChild);
                    }
                });
                ('selectedValue' in options) && dk.select(options.selectedValue);
            },
            search: options.search || 'strict',
            open: function(){
                $('.dk-search-input',this.data.elem).focus();
                ('open' in options) && options.open.call(this);
            },
            close: function(){
                $('.dk-search-input',this.data.elem).val("").blur();
                $('.dk-option',this.data.elem).remove();
                $(this.options).appendTo(this.data.elem.lastChild);
                ('close' in options) && options.close.call(this);
            },
            change: ('change' in options) ? options.change : new Function
        });
    }

I pushed a change. You should be able to pull master and see it 👍