I tried working on it again and made a little progress... Now I got parent and child selected correctly, but I don't have mouseover working for some reason...
http://jsbin.com/avigi/edit On 13 Apr, 02:43, Lwangaman <donjohn.f...@gmail.com> wrote: > One more detail: mouseout should not take effect until mouseup. > In fact, right now, if I click and begin to drag, then still holding > the mouse button I leave the area, and still holding it come back over > the cells, they no longer get checked / unchecked because mouseout has > already kicked in. Instead it shouldn't kick in until I actually let > go of the mouse button, and I could let go of it anywhere on the page > I suppose, so I guess "mouseup" would have to be applied to the whole > document. > > On 13 Apr, 02:33, Lwangaman <donjohn.f...@gmail.com> wrote: > > > I tried something along those lines... > > >http://jsbin.com/ehedu/edit > > > But I just don't have the hang of using "this" correctly and knowing > > when to refer to dom elements as dom elements or as jquery objects... > > > The idea is to tie all events to the container of the checkboxes (i.e. > > table cells), and not to the external container (table or ul list or > > whatever), and yet be able to read and write the value of the > > checkboxes... > > > On 13 Apr, 01:13, Lwangaman <donjohn.f...@gmail.com> wrote: > > > > Taking up jscripter's suggestion, I just noticed myself that applying > > > the mousedown and mouseover to the whole table keeps you from being > > > able to click on any links that may be contained in the table. For > > > example my table has links in the header cells that when clicked > > > reorder the table according to that column. Now I can no longer click > > > them... > > > And, as jscripter says, in the X-Library the mousedown and mouseover > > > was applied to the cells containing the checkboxes and not to the > > > checkboxes themselves, so that it was enough to click on the cells > > > surrounding the checkboxes in order to get them checked / unchecked. > > > > Ricardo do you think you could manage something like that? (I'm only > > > an apprentice and I don't have your expertice!) > > > > On 12 Apr, 22:31, jscripter <pc88m...@gmail.com> wrote: > > > > > Hey - this is great work - I just happened to be looking for this > > > > functionality. > > > > > How would you apply what you have done here to re-writing the original > > > > X-library code that uses TDs for the checkbox label? > > > > > Thanks! > > > > > On Apr 12, 2:04 pm, Ricardo <ricardob...@gmail.com> wrote: > > > > > > Sure! I have a few other plugins I also want to upload, I'll do that. > > > > > > I took the time to rewrite it more carefully. No more binding/ > > > > > unbinding, a single var, all namespaced and bugs ironed out (if you > > > > > put the cursor away while holding the button, the mouseover would > > > > > remain active even after mouseup). > > > > > > The advantage of namespacing is you can easily remove all event > > > > > handlers. I included that in the plugin, in the example you can use $ > > > > > ('ul').dragCheck(false) to disable it completely. > > > > > >http://jsbin.com/amoxi/edit > > > > > > cheers, > > > > > - ricardo > > > > > > On Apr 12, 9:48 am, Lwangaman <donjohn.f...@gmail.com> wrote: > > > > > > > @Ricardo > > > > > > Do you think it could be useful to add this to the jquery plugins at > > > > > > plugins.jquery.com? I'd say it could be put under your name because > > > > > > you did all the big work! > > > > > > > On 12 Apr, 14:35, Lwangaman <donjohn.f...@gmail.com> wrote: > > > > > > > > Ok that works better, I just changed "clicked.checked = > > > > > > > !isChecked" to > > > > > > > "clicked.checked = isChecked": > > > > > > > >http://jsbin.com/idihi/edit > > > > > > > > On 12 Apr, 08:11, Ricardo <ricardob...@gmail.com> wrote: > > > > > > > > > The problem with your fix is that the event target for the > > > > > > > > mouseup is > > > > > > > > not the same as the mousedown. You can resolve that by saving > > > > > > > > the > > > > > > > > clicked checkbox in a var, and because of event order the > > > > > > > > change has > > > > > > > > to be made on 'click' rather than mouseup. > > > > > > > > >http://jsbin.com/asizu/edit > > > > > > > > > Sorry for the bugs, this was written rather quickly, I hope it > > > > > > > > works > > > > > > > > now :) > > > > > > > > > On Apr 11, 11:30 am, Lwangaman <donjohn.f...@gmail.com> wrote: > > > > > > > > > > Ok I tried to touch up the code a little to fix that, here's > > > > > > > > > my > > > > > > > > > example: > > > > > > > > > >http://jsbin.com/iyubi/edit > > > > > > > > > > Now, with a single click, the value on mouseup is reversed to > > > > > > > > > keep it > > > > > > > > > as it was with mousedown. But, when you do a drag, the > > > > > > > > > mouseup of the > > > > > > > > > last checkbox is not canceled or reversed... I suppose it > > > > > > > > > would be > > > > > > > > > enough to cancel $(this)'s mouseup, but how would you refer > > > > > > > > > to $(this) > > > > > > > > > from within the $boxes.bind('mouseover')? > > > > > > > > > > On 11 Apr, 16:07, Lwangaman <donjohn.f...@gmail.com> wrote: > > > > > > > > > > > Hmm, just noticed one problem though... A single click on a > > > > > > > > > > checkbox > > > > > > > > > > is supposed to work too, but with this code as soon as you > > > > > > > > > > mouseup the > > > > > > > > > > value goes back the other way... You have to drag off in > > > > > > > > > > order to keep > > > > > > > > > > the value in there... > > > > > > > > > > > On 11 Apr, 06:21, Ricardo <ricardob...@gmail.com> wrote: > > > > > > > > > > > > I think you already got the .dc namespacing thing, so: > > > > > > > > > > > the mousedown > > > > > > > > > > > is not being bound to the checkbox, but to the container > > > > > > > > > > > element (the > > > > > > > > > > > table, or in my example below, the UL). When you click a > > > > > > > > > > > checkbox the > > > > > > > > > > > mousedown event will bubble up to the container and fire > > > > > > > > > > > this handler. > > > > > > > > > > > > As I expected my code had some flaws a few typing errors, > > > > > > > > > > > see it fixed/ > > > > > > > > > > > working here: > > > > > > > > > > > >http://jsbin.com/edabo/edit > > > > > > > > > > > > I added the ability to specify a selector for the > > > > > > > > > > > checkboxes, that way > > > > > > > > > > > you can skip the ones you don't want. In case it's not > > > > > > > > > > > provided all > > > > > > > > > > > checkboxes are used by default. > > > > > > > > > > > > cheers, > > > > > > > > > > > - ricardo > > > > > > > > > > > > On Apr 10, 8:17 pm, Lwangaman <donjohn.f...@gmail.com> > > > > > > > > > > > wrote: > > > > > > > > > > > > > Ok first of all thanks for taking interest! > > > > > > > > > > > > Then, I've tried going through your code and applying > > > > > > > > > > > > it, and I have a > > > > > > > > > > > > few questions: > > > > > > > > > > > > -- Besides the mouseover.dc that I didn't get either... > > > > > > > > > > > > -- I'm supposing that $boxes would be a variable where > > > > > > > > > > > > all the > > > > > > > > > > > > checkboxes that are applicable have been stored > > > > > > > > > > > > previously? Yet, if > > > > > > > > > > > > you build it as a "plugin" you have no way of defining > > > > > > > > > > > > which > > > > > > > > > > > > checkboxes are to comprised (unless this functionality > > > > > > > > > > > > is built into > > > > > > > > > > > > the plugin using data passed through parameters, I > > > > > > > > > > > > suppose). > > > > > > > > > > > > -- Then I don't quite understand what the "mousedown" > > > > > > > > > > > > is being bound > > > > > > > > > > > > to. In my example (which was not built as a plugin, but > > > > > > > > > > > > I suppose a > > > > > > > > > > > > plugin or defined function would be even better because > > > > > > > > > > > > it's much more > > > > > > > > > > > > flexible and anyone can download it and use it), the > > > > > > > > > > > > "mousedown" was > > > > > > > > > > > > being bound to all the cells that had checkboxes in > > > > > > > > > > > > them, and I was > > > > > > > > > > > > determining that through the class I had given them > > > > > > > > > > > > "mychkbox" (because I didn't want some of the > > > > > > > > > > > > checkboxes included, > > > > > > > > > > > > since they do not have an active state; the table has > > > > > > > > > > > > names, > > > > > > > > > > > > addresses, emails, and those that don't have an email > > > > > > > > > > > > have an inactive > > > > > > > > > > > > checkbox). I was also trying to follow > > > > > > > > > > > > cross-browser.com's way of > > > > > > > > > > > > listening to the mousedown on the cell containing the > > > > > > > > > > > > checkbox rather > > > > > > > > > > > > than on the checkbox itself, making the whole > > > > > > > > > > > > click-drag thing a lot > > > > > > > > > > > > more user-friendly. > > > > > > > > > > > > > On 10 Apr, 20:36, jay <jay.ab...@gmail.com> wrote: > > > > > > > > > > > > > > Just curious.. What is the difference between > > > > > > > > > > > > > mouseover.dc and > > > > > > > > > > > > > mouseover? > > > > > > > > > > > > > > On Apr 10, 1:44 pm, Ricardo <ricardob...@gmail.com> > > > > > > > > > > > > > wrote: > > > > > > > > > > > > > > > This (untested) is how I envision the code for that: > > > > > > > > > > > > > > > $.fn.dragCheck = function(){ > > > > > > > > > > > > > > //this == the current jQuery element > > > > > > > > > > > > > > return this.each(function(){ > > > > > > > > > > > > > > > //this == current element in the loop (table > > > > > > > > > > > > > > etc) > > > > > > > > > > > > > > $(this).bind('mousedown', function(e){ > > > > > > > > > > > > > > > //don't do anything if you didn't click a > > > > > > > > > > > > > > checkbox > > > > > > > > > > > > > > if ( !$(e.target).is(':checkbox') ) > > > > > > > > > > > > > > return true; > > > > > > > > > > > > > > > //get the clicked checkbox state > > > > > > > > > > > > > > isChecked = e.target.checked; > > > > > > > > > > > > > > //apply it to all other checkboxes on > > > > > > > > > > > > > > mouseover > > > > > > > > > > > > > > $boxes.bind('mouseover.dc', function(){ > > > > > > > > > > > > > > this.checked = isChecked; > > > > > > > > > > > > > > }); > > > > > > > > > > > > > > > }).bind('mouseup', function(e){ > > > > > > > > > > > > > > //cancel the mouseover action > > > > > > > > > > > > > > $boxes.unbind('mouseover.dc'); > > > > > > > > > > > > > > }); > > > > > > > > > > > > > > > }; > > > > > > > > > > > > > > > $('#table1').dragCheck(); > > > > > > > > > > > > > > > cheers, > > > > > > > > > > > > > > - ricardo > > > > > > > > > > > > > > > On 9 abr, 17:15, Lwangaman <donjohn.f...@gmail.com> > > > > > > > > > > > > > > wrote: > > > > > > > > > > > > > > > > Ok I resolved the "cannot assign to a function > > > > > > > > > > > > > > > result" problem by > > > > > > > > > > > > > > > putting the value assignment into a > > > > > > > > > > > > > > > "function(){}": > > > > > > > > > > > > > > > > 48 $("td.mychkbox").each( > > ... > > leggi tutto