4

I want to ensure the following very primitive behavior for selectable:

  1. disable lasso selection completely, only toggle whatever touched (clicked on)
  2. do exactly what is done when Ctrl is pressed—e.g. deselect selected and select unselected item and free users from holding Ctrl key.

I am trying to build sort of a basket—when it opens up its content is displayed and some items are highlighted. Then user either selects more or deselect others, submits the form. That's all.

I fought with Selectable for quite some time and its a very smart piece of script, but I seem to be unable to achieve this basic requirements. When form is shown users need to hold the Ctrl key, otherwise already selected items get lost.

2 Answers 2

4

It is easiert to not use selectable at all:

$('ul > li').click(function() {
  $(this).toggleClass('ui-state-highlight');
});
Sign up to request clarification or add additional context in comments.

Comments

3

I answered something similar the other day that I think solves part 1 of your problem - How to select multiple items using mouse click?. This allows left click or lasso to select/deselect without the need for the Ctrl key.

However, looking over the demo, I created for that question, by adding

tolerance: 'fit'

to the selectable, it seems to disable selection via lasso which I think solves part 2 of your question.

Lastly, if you use a jQueryUI theme, you will also need to override the lasso style. The relevant theme rule is:

.ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; }

and something like

.ui-selectable-helper { display:none }

should do it.

Updated demo

5 Comments

this does not do what you say it does. as far as I know, tolerance: 'fit' is about whether the lasso needs to surround an element to select it or not.
@Sahuagin for this question it does help because it is very difficult to start selecting items and manage to completely surrounded one with the lasso. It was obviously good enough at the time. It is not a bulletproof solution as, depending on the size and shape of the selectable items it might be possible to lasso still.
@andyb well, for me in chrome, your demo doesn't even work. clicking doesn't select anything, and I can still lasso things if I drag a big enough area.
@Sahuagin tolerance: 'fit' is not in the setup in the demo (I'll admit it's a less than ideal "demo") but my answer does say "if you add...". So adding it removes the lasso selection as I described. The demo works for me just fine on Windows Chrome 43.0.2334.0. Which Chrome are you using?
@andyb tolerance: 'fit' is in the updated demo. it wasn't working yesterday, but it seems to be working now.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.