Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Input element not working #18

Open
claudchan opened this issue Apr 14, 2016 · 10 comments
Open

Input element not working #18

claudchan opened this issue Apr 14, 2016 · 10 comments

Comments

@claudchan
Copy link

Hi,
Any way can exclude action elements such as input fields, buttons, etc...?
Will be great if implement options or api to use.

@jonathan-vallet
Copy link

Hi,

I have made a little update to prevent click when user has drag content from a link, I think it could work with buttons too. I didn't have permissions to make a PR. Here is the new code. Feel free to update the lib if you think it's useful.

(function (root, factory) {
if (typeof define === 'function' && define.amd) {
define(['exports'], factory);
} else if (typeof exports !== 'undefined') {
factory(exports);
} else {
factory((root.dragscroll = {}));
}
}(this, function (exports) {
var _window = window;
var _document = document;
var mousemove = 'mousemove';
var mouseup = 'mouseup';
var mousedown = 'mousedown';
var click = 'click';
var EventListener = 'EventListener';
var addEventListener = 'add'+EventListener;
var removeEventListener = 'remove'+EventListener;

var dragged = [];
var reset = function(i, el) {
    for (i = 0; i < dragged.length;) {
        el = dragged[i++];
        el = el.container || el;
        el[removeEventListener](mousedown, el.md, 0);
        _window[removeEventListener](mouseup, el.mu, 0);
        _window[removeEventListener](mousemove, el.mm, 0);
        _window[removeEventListener](click, el.cl, 0);
    }

    // cloning into array since HTMLCollection is updated dynamically
    dragged = [].slice.call(_document.getElementsByClassName('dragscroll'));
    for (i = 0; i < dragged.length;) {
        (function(el, lastClientX, lastClientY, pushed, scroller, cont){
            (cont = el.container || el)[addEventListener](
                mousedown,
                cont.md = function(e) {
                    if (!el.hasAttribute('nochilddrag') ||
                        _document.elementFromPoint(
                            e.pageX, e.pageY
                        ) == cont
                    ) {
                        pushed = 1;
                        hasMove = false;
                        lastClientX = e.clientX;
                        lastClientY = e.clientY;

                        e.preventDefault();
                    }
                }, 0
            );

            _window[addEventListener](
                mouseup, cont.mu = function() {pushed = 0;}, 0
            );

            _window[addEventListener](
                mousemove,
                cont.mm = function(e) {
                    if (pushed) {
                        hasMove = true;
                         (scroller = el.scroller||el).scrollLeft -=
                             (- lastClientX + (lastClientX=e.clientX));
                         scroller.scrollTop -=
                             (- lastClientY + (lastClientY=e.clientY));
                    }
                }, 0
            );

            _window[addEventListener](
                click,
                cont.cl = function(e) {
                    if(hasMove) {
                        e.preventDefault();
                    }
                }, 0
            );
         })(dragged[i++]);
    }
}


if (_document.readyState == 'complete') {
    reset();
} else {
    _window[addEventListener]('load', reset, 0);
}

exports.reset = reset;

}));

@claudchan
Copy link
Author

Doesn't work.

@graphiclaboratory
Copy link

I've got the same problem

@asvd
Copy link
Owner

asvd commented Jun 22, 2016

would it solve the problem, if you use the nochilddrag attribute? (see readme of dragscroll)

@claudchan
Copy link
Author

nochilddrag it stop entire element. Not fit into my current problems. By default, the plugin should ignore those inputs, button, links, etc...

@claudchan
Copy link
Author

Jquery DragOn did a very good job. But I tested there have mobile issues.

@Necko1996
Copy link

Can anyone tell me how to fix input boxes?

@eysmnje
Copy link

eysmnje commented Sep 11, 2018

Are we just going to remove
'e.preventDefault();'
?

@eysmnje
Copy link

eysmnje commented Sep 11, 2018

mousedown --> remove 'e.preventDefault()'
mousemove --> add 'e.preventDefault()'

@evgeniy-vashchuk
Copy link

You can find answer for this question here:

#34

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants