3

i have used jquery selectable to select elements its working fine .

myModule.directive('uiSelectable', function ($parse) {
    return {
        link: function (scope, element, attrs, ctrl) {

        scope.$on('clearselection', function (event, document) {
          element.find('.ui-selected').removeClass('ui-selected')
        });

            element.selectable({
                stop: function (evt, ui) {
                    var collection = scope.$eval(attrs.docArray)
                    var selected = element.find('div.parent.ui-selected').map(function () {
                        var idx = $(this).index();
                        return { document: collection[idx] }
                    }).get();

                    scope.selectedItems = selected;
                    scope.$apply()
                }
            });
        }
    }
});

issue is when i click child element in selectable it doesn't get clicked rather its parent element click (where i have implemented selectable) gets fired

can some one guide me how can i click child element using angularjs

Plunker

http://plnkr.co/edit/3cSef9h7MeYSM0cgYUIX?p=preview

after a bit research i come to the conclusion its because of Jquery UI-Selectable any one have idea how to fix it with UI-Selectable or have any other alternative to select multiple items with ctlr + shift

Salman
  • 1,266
  • 5
  • 21
  • 41
  • can you do something like `$(selected).click()` – lucuma Feb 13 '14 at 14:42
  • i need to do it angular way. – Salman Feb 13 '14 at 14:44
  • You are already using jquery, $(this), so why? Plain javascript would be something like `selectable.onclick()` so I don't quite get the point about the angular way? – lucuma Feb 13 '14 at 14:47
  • $(selected).click i didn't get what u mean can u edit in plunker because what i feel is that selected is the element but i want child element click – Salman Feb 13 '14 at 14:52
  • 1
    Pretty sure it's related to this post. http://stackoverflow.com/questions/5133966/how-to-enable-dblclick-event-on-elements-which-was-binded-with-jquery-ui-selecta – Craig Squire Feb 13 '14 at 15:30
  • @CraigSquire thanks for helping bro . please add this as answer so it can help others too – Salman Feb 14 '14 at 07:55

1 Answers1

0

Add a distance: 1 will solve your problem. Because when you start selecting, jQuery UI add a element (ui-selectable-helper) right below the mouse and prevent you from clicking elements "below". http://plnkr.co/edit/WV9NmvwFX5ADYv5OUumF?p=preview

6220119
  • 809
  • 10
  • 21