[jQuery] slider ui 1.6 with different handle class doesn't work
I was using jQuery UI 1.5.3 and after I upgraded to 1.6 some of my
sliders are not working properly. To be more specific, once I let go
of the slider handle after moving it, it still moves with the mouse,
even though my mouse button is not pressed anymore.
It seems that if I used a different handle than the default, the
above
issue occurs. So
$('#someId').slider(); works fine, but $('#someId').slider({ handle:
'.someHandleClass' }); doesn't.
Any ideas?
[jQuery] Re: 1.3.2 td class selector only picks the first td
Yeah, I've written a simple test myself in which everything works
fine. However, in the case where it doesn't work, there's a lot of
other code that might be causing problems. The table itself is inside
a widget created using jQuery sortable, draggable, droppable, and
resizable. Initially the widget content, including the table is
hidden, then copied into the widget and shown, so there's a lot of
other reasons why it might not work.
On Apr 22, 9:21 pm, Shane Riley shanerileydoti...@gmail.com wrote:
There's definitely nothing wrong with the JQuery. Can you post a test
case so that we can see all of the pieces to the puzzle?
On Apr 22, 7:07 pm, Richard D. Worth rdwo...@gmail.com wrote:
Your code looks fine, and I wasn't able to reproduce what you're describing:
http://jsbin.com/ucaqi
- Richard
On Wed, Apr 22, 2009 at 6:18 PM,kapeerlend.so...@gmail.com wrote:
The following code worked fine in 1.2.6 but after upgrading to 1.3.2
only the first table cell is shown/hidden.
table
tr
td class=morea/td
td class=moreb/td
td class=morec/td
td class=mored/td
/tr
/table
span id=moreLessmore/span
...
jQuery('#moreLess').click(function() {
if(jQuery(this).text() == 'more') {
jQuery(this).text('less');
jQuery('.more').show();
} else {
jQuery(this).text('more');
jQuery('.more').hide();
}
});
Version 1.2.6 used to add style=display: none; when hiding, and
would remove it when showing. Version 1.3.2 adds toggles between
style=display: none; and style=display: table-cell;. I don't
think that matters really, what does matter however is that if I alert
jQuery('.more').length I get 1 not 4. Am I doing something wrong?
Thanks.
[jQuery] 1.3.2 td class selector only picks the first td
The following code worked fine in 1.2.6 but after upgrading to 1.3.2
only the first table cell is shown/hidden.
table
tr
td class=morea/td
td class=moreb/td
td class=morec/td
td class=mored/td
/tr
/table
span id=moreLessmore/span
...
jQuery('#moreLess').click(function() {
if(jQuery(this).text() == 'more') {
jQuery(this).text('less');
jQuery('.more').show();
} else {
jQuery(this).text('more');
jQuery('.more').hide();
}
});
Version 1.2.6 used to add style=display: none; when hiding, and
would remove it when showing. Version 1.3.2 adds toggles between
style=display: none; and style=display: table-cell;. I don't
think that matters really, what does matter however is that if I alert
jQuery('.more').length I get 1 not 4. Am I doing something wrong?
Thanks.
[jQuery] if the handle of a ui.slider is clicked/dblclicked, the arrow keys can be used to move the handle - even if disabled.
As the subject states, if you click or double click on the handle of a ui.slider, you can then use the arrows to move the handle, even if the slider is disabled. Also, if you use the up or down arrows, the handle goes directly to the min value. Is there a way to fix this?
[jQuery] Re: How can I add a TRUE custom event or modify existing jQuery functions?
Thanks, I'll actually give that a try.
On Jan 11, 9:46 am, Ariel Flesler afles...@gmail.com wrote:
I just made a plugin to do EXACTLY what you're asking for.
It's not formally released yet so there's no documentation. If you
want, you can use it.
http://test.flesler.com/jquery.broadcast/
Note that it requires jQuery 1.3. That means you need to use the
version on trunk or any of the recently released betas.
Cheers
--
Ariel Fleslerhttp://flesler.blogspot.com
On Jan 9, 5:30 pm, kape erlend.so...@gmail.com wrote:
I have created custom styled buttons in my page and would like to
toggle their class and therefore their look when they get disabled or
enabled. So is there any way to call a function when .removeAttr
('disabled'), .attr('disabled', ''), and .attr('disabled', 'disabled')
are invoked? Basically, is there any way to have enable/disable act
like an event such as click, mouseover, etc.?
I've tried overwriting the jQuery function as follows:
jQuery.fn.removeAttr = function(name) {
if(this.eq(0).hasClass('buttonDisabled') name ==
'disabled')
this.eq(0).removeClass('buttonDisabled');
jQuery.attr(this.get(0), name, );
if (this.get(0).nodeType == 1)
this.get(0).removeAttribute(name);
};
and when $('.buttonDisabled').removeAttr('disabled') is called, the
disabled attribute and buttonDisabled class are removed. This is what
I want, but it doesn't seem right. I shouldn't be overwriting the
removeAttr function. Also, I'd have to do the same thing for jQuery's
attr() function to add the buttonDisabled class when .attr('disabled',
'disabled') is called. Can I add the code I need to the functions and
then call super somehow? Is there a simpler way to achieve what I
want?
[jQuery] ui.slider with dynamic minimum range
I am trying to implement a slider that can have one or two handles
determined dynamically. If there are two handles they have to have a
minimum range and if one handle gets close to the other handle, the
other handle should move away in order to keep the minimum range. I
found the following problems:
1. When I use $('#sliderId').data('slider').options.range = true/
false to dynamically set/unset the range if there are two or one
handle respectively, the range = true does get set in the options, but
ui.range = undefined. Also, the transparent fade doesn't get
dynamically added in between the handles. I don't really care about
this problem as much as I can calculate the range using $
('#sliderId').slider('value', $('#otherHandleId')) - $
('#sliderId').slider('value', $('#oneHandleId')) but it would be nice
to have the fade added/removed from in between the handles dynamically
without me having to .show()/.hide() it.
2. I use the above method to compute the range between to handles (if
there are two) and if the range is less than the minimum range, I use $
('#sliderId').slider('moveTo', ui.value +/- minimum Range, $
('#otherHandleId'), true) to move the other slider farther away from
the current slider. The problems is, the moveTo triggers the
otherHandld to become the ui.handle even though the mouse events do
not target the otherHandle. This cause the two handles to just bounce
back and forth as one handle tries to move the other handle away, then
the other handle tries to move the one handle away and so on.
So, is there a way to use moveTo without firing the start, slide,
change callbacks, which seems to be the case? Shouldn't the ui.handle
be tied to the mousedown/mousmove event, and not switch when moveTo is
called?
Any assistance would be greatly appreciated.
[jQuery] ui.slider issues with .data() and moveTo
I'm using jQuery 1.2.6 and ui 1.5.2 and am trying to implement a
slider with two handles. When one handle moves too close to the
other, I want the other handle to move too in order to keep a minimum
range.
I found two things that don't necessarily work as they should:
1. When flipping dynamically from one handle to two handles, I used
the $('#sliderId').data('slider').options.range = true. This did set
the range option to true, but the range div was not shown and ui.range
was undefined.
2. When one handle named low gets close to the other handle named
high, I used $('#sliderId').slider('moveTo', (low + min range), $
('#highId'), true) to move the high handle away from the low
handle ensuring that the range is always greater than the minimum.
However, the moveTo seems to trigger the slide function which then
attempts to move the low handle away from the high handle. This
just causes the whole thing to bounce back and forth rather than one
slider to push/nudge the other up or down. Furthermore, the ui.handle
flips back and forth between low and high and from the
ui.slider.js code it would seem that the handle is determined by
mousedown/mousemove not moveTo.
So I don't really care about the 1st issue with the range as I can
determine the range using $('#sliderId').slider('value', $('#highId'))
- $('#sliderId').slider('value', $('#lowId')), but how can I get
around the 2nd issue? Is there a way to suppress moveTo from
triggering the start, slide, and change functions? Is there an
alternative way of moving the other slider other than using moveTo?
Finally, are these bugs? Shouldn't the range be initialized properly
if I set it to true? Shouldn't the ui.handle be determined by the
handle where the mouse is down?
[jQuery] append empty string causes error
I'm not sure if this is correct behavior or a bug, but if I append an
empty string it causes an error. So $('#someId').append('') causes an
error. In my case, I'm actually supplying a variable to append() but
this variable could be an empty string. I don't see why appending
nothing would cause an error, which is why I think it's a bug.
Anyway, for now, I'm just going to check if the variable is empty
before calling append().
[jQuery] Re: 1.2.5 and 1.2.6 not working at all for me - what am I missing?
Thanks for all the replies. I appreciate when a support forum is
actually useful.
Believe it or not, I think Victor is right, 1.2.6 definitely doesn't
work with prototype. In particular something in prototype's
effects.js library is causing jQuery to act up. This is the test I
performed:
!DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN http://
www.w3.org/TR/html4/loose.dtd
html
head
meta http-equiv=Content-Type content=text/html;
charset=ISO-8859-1
titleTest Page/title
script type=text/javascript language=JavaScript src=includes/
prototype-portal/prototype.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/effects.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/builder.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/dragdrop.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/portal.js/script
script type=text/javascript language=JavaScript src=includes/
jquery/jquery-1.2.6.pack.js/script
script type=text/javascript language=JavaScript
jQuery.noConflict();
jQuery(document).ready(function() {
alert(jQuery('#tabs td').html());
});
/script
/head
body
This is a test page.
table id=tabs style=border: solid black 1px;
tr
tdThis is a table cell on the test page./td
tdThis is another table cell./td
/tr
/table
Done.
/body
/html
The above page shows an alert with undefined on load. If I comment
the effects.js line, the page shows an alert with This is a table
cell on the test page. as expected.
!DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN http://
www.w3.org/TR/html4/loose.dtd
html
head
meta http-equiv=Content-Type content=text/html;
charset=ISO-8859-1
titleTest Page/title
script type=text/javascript language=JavaScript src=includes/
prototype-portal/prototype.js/script
!--
script type=text/javascript language=JavaScript src=includes/
prototype-portal/effects.js/script
--
script type=text/javascript language=JavaScript src=includes/
prototype-portal/builder.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/dragdrop.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/portal.js/script
script type=text/javascript language=JavaScript src=includes/
jquery/jquery-1.2.6.pack.js/script
script type=text/javascript language=JavaScript
jQuery.noConflict();
jQuery(document).ready(function() {
alert(jQuery('#tabs td').html());
});
/script
/head
body
This is a test page.
table id=tabs style=border: solid black 1px;
tr
tdThis is a table cell on the test page./td
tdThis is another table cell./td
/tr
/table
Done.
/body
/html
It's weird because if I have the alert as
alert(jQuery('#tabs').html()); it works, but others like
alert(jQuery('body').html()); don't.
Again, it is unfortunate that I'm stuck using prototype for now, but
that's the situation. Any ideas on how to get jQuery to work again?
Thanks,
Kape
On May 28, 3:18 am, John Resig [EMAIL PROTECTED] wrote:
Victor: That shouldn't be the case (if you're using noConflict). Note
that the code he presented worked with 1.2.3.
--John
On Wed, May 28, 2008 at 4:41 AM, Victor [EMAIL PROTECTED] wrote:
Kape:
Just read your post again. You are using prototype. I believe that it
conflicts with 1.2.5 and 1.2.6.
Victor
On May 27, 5:26 pm, kape [EMAIL PROTECTED] wrote:
OK, I'm sure that someone would have mentioned that the latest
releases don't work, so that can't be it. It's obvious that I'm
missing something.
I've been using jQuery 1.2.3 for months now, and today I wanted to use
the ui.slider plugin which requires offsetWidth() which is not in
1.2.3. So I figured I'd just download the latest release, i.e. 1.2.6
and be done with it. I did just that, but when I ran my app, there
were a whole bunch of JS errors. I figured that's to be expected, my
code isn't perfect. So I started debuging them. So far, I'm still
trying to debug the very first one.
I have something as simple as:
jQuery(document).ready(function() {
alert(jQuery('body').html());
});
If I use 1.2.3 everything works and onLoad I get the html of the body
element. If I change the one line to 1.2.5 or 1.2.6, I get an alert
with undefined. The reason I'm using jQuery() instead of $() is
that I am also using prototype for their portal plugin. I wish I
wasn't but the jQuery verion just isn't cutting it yet. And yes, I
have the jQuery.noConflict(); line first in my JS code.
So, what am I missing? Do I need to download any other file besides
jquery-1.2.5.pack.js for example? Are the new releases not working
with prototype? Are they using different syntax
[jQuery] Versions 1.2.5 and 1.2.6 not working with prototype
The latest releases of jQuery, i.e. 1.2.5 and 1.2.6 do not work in
conjunction with prototype. I particular, the effects.js library of
prototype and something in jQuery are not compatible. Below is an
example of how to reproduce:
!DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN http://
www.w3.org/TR/html4/loose.dtd
html
head
titleTest Page/title
script type=text/javascript src=/prototype/prototype.js/
script
script type=text/javascript src=/prototype/effects.js/
script
script type=text/javascript src=/prototype/builder.js/
script
script type=text/javascript src=/prototype/dragdrop.js/
script
script type=text/javascript src=/prototype/portal.js/
script
script type=text/javascript src=/jquery/jquery-1.2.6.js/
script
script type=text/javascript language=JavaScript
jQuery.noConflict();
jQuery(document).ready(function() {
alert(jQuery('body').html());
});
/script
/head
body
This is a test page.
table id=tabs style=border: solid black 1px;
tr
tdThis is a table cell on the test page./td
tdThis is another table cell./td
/tr
/table
Done.
/body
/html
You would expect the above page to show an alert containing the html
of the page on load. Instead, it shows an alert with undefined.
Kape
[jQuery] Re: Versions 1.2.5 and 1.2.6 not working with prototype
I upgraded prototype from 1.5.1.1 to 1.6.0.2 and effects, builder, and
dragdrop from 1.7.1b3 to 1.8.1 and everything seems to be working
now. So if anyone is experiencing the same problem, upgrade to the
latest versions of everything.
On May 28, 11:21 am, kape [EMAIL PROTECTED] wrote:
The latest releases of jQuery, i.e. 1.2.5 and 1.2.6 do not work in
conjunction with prototype. I particular, the effects.js library of
prototype and something in jQuery are not compatible. Below is an
example of how to reproduce:
!DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd;
html
head
titleTest Page/title
script type=text/javascript src=/prototype/prototype.js/
script
script type=text/javascript src=/prototype/effects.js/
script
script type=text/javascript src=/prototype/builder.js/
script
script type=text/javascript src=/prototype/dragdrop.js/
script
script type=text/javascript src=/prototype/portal.js/
script
script type=text/javascript src=/jquery/jquery-1.2.6.js/
script
script type=text/javascript language=JavaScript
jQuery.noConflict();
jQuery(document).ready(function() {
alert(jQuery('body').html());
});
/script
/head
body
This is a test page.
table id=tabs style=border: solid black 1px;
tr
tdThis is a table cell on the test page./td
tdThis is another table cell./td
/tr
/table
Done.
/body
/html
You would expect the above page to show an alert containing the html
of the page on load. Instead, it shows an alert with undefined.
Kape
[jQuery] Re: 1.2.5 and 1.2.6 not working at all for me - what am I missing?
I upgraded prototype from 1.5.1.1 to 1.6.0.2 and effects, builder, and
dragdrop from 1.7.1b3 to 1.8.1 and everything seems to be working
now. So if anyone is experiencing the same problem, upgrade to the
latest versions of everything.
On May 28, 9:58 am, kape [EMAIL PROTECTED] wrote:
Thanks for all the replies. I appreciate when a support forum is
actually useful.
Believe it or not, I think Victor is right, 1.2.6 definitely doesn't
work with prototype. In particular something in prototype's
effects.js library is causing jQuery to act up. This is the test I
performed:
!DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd;
html
head
meta http-equiv=Content-Type content=text/html;
charset=ISO-8859-1
titleTest Page/title
script type=text/javascript language=JavaScript src=includes/
prototype-portal/prototype.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/effects.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/builder.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/dragdrop.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/portal.js/script
script type=text/javascript language=JavaScript src=includes/
jquery/jquery-1.2.6.pack.js/script
script type=text/javascript language=JavaScript
jQuery.noConflict();
jQuery(document).ready(function() {
alert(jQuery('#tabs td').html());
});
/script
/head
body
This is a test page.
table id=tabs style=border: solid black 1px;
tr
tdThis is a table cell on the test page./td
tdThis is another table cell./td
/tr
/table
Done.
/body
/html
The above page shows an alert with undefined on load. If I comment
the effects.js line, the page shows an alert with This is a table
cell on the test page. as expected.
!DOCTYPE html PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd;
html
head
meta http-equiv=Content-Type content=text/html;
charset=ISO-8859-1
titleTest Page/title
script type=text/javascript language=JavaScript src=includes/
prototype-portal/prototype.js/script
!--
script type=text/javascript language=JavaScript src=includes/
prototype-portal/effects.js/script
--
script type=text/javascript language=JavaScript src=includes/
prototype-portal/builder.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/dragdrop.js/script
script type=text/javascript language=JavaScript src=includes/
prototype-portal/portal.js/script
script type=text/javascript language=JavaScript src=includes/
jquery/jquery-1.2.6.pack.js/script
script type=text/javascript language=JavaScript
jQuery.noConflict();
jQuery(document).ready(function() {
alert(jQuery('#tabs td').html());
});
/script
/head
body
This is a test page.
table id=tabs style=border: solid black 1px;
tr
tdThis is a table cell on the test page./td
tdThis is another table cell./td
/tr
/table
Done.
/body
/html
It's weird because if I have the alert as
alert(jQuery('#tabs').html()); it works, but others like
alert(jQuery('body').html()); don't.
Again, it is unfortunate that I'm stuck using prototype for now, but
that's the situation. Any ideas on how to get jQuery to work again?
Thanks,
Kape
On May 28, 3:18 am, John Resig [EMAIL PROTECTED] wrote:
Victor: That shouldn't be the case (if you're using noConflict). Note
that the code he presented worked with 1.2.3.
--John
On Wed, May 28, 2008 at 4:41 AM, Victor [EMAIL PROTECTED] wrote:
Kape:
Just read your post again. You are using prototype. I believe that it
conflicts with 1.2.5 and 1.2.6.
Victor
On May 27, 5:26 pm, kape [EMAIL PROTECTED] wrote:
OK, I'm sure that someone would have mentioned that the latest
releases don't work, so that can't be it. It's obvious that I'm
missing something.
I've been using jQuery 1.2.3 for months now, and today I wanted to use
the ui.slider plugin which requires offsetWidth() which is not in
1.2.3. So I figured I'd just download the latest release, i.e. 1.2.6
and be done with it. I did just that, but when I ran my app, there
were a whole bunch of JS errors. I figured that's to be expected, my
code isn't perfect. So I started debuging them. So far, I'm still
trying to debug the very first one.
I have something as simple as:
jQuery(document).ready(function() {
alert(jQuery('body').html());
});
If I use 1.2.3 everything works and onLoad I get the html of the body
element. If I change the one line to 1.2.5 or 1.2.6, I get an alert
with undefined. The reason I'm using jQuery
[jQuery] Re: removeAttr for rowspan
I encountered the same problem when I upgraded to 1.2.6 and using
rowspan instead of rowSpan fixed it. I guess it was a bug fix.
On May 27, 1:27 pm, snobo [EMAIL PROTECTED] wrote:
Since upgrading to 1.2.5 (the same applies to1.2.6), an attempt to $
('... td').removeAttr('rowSpan') triggers an error in IE6/7.
Previously (up to 1.2.4b) it effectively setrowSpanto 1. It still
works that way in FF.
I'm not sure is it a bug or a feature, but of course it has broken my
application, so... I guess it should be either fixed or explicitly
noted in the docs. I wonder, will it cause the same problem for some
other attributes?
[jQuery] 1.2.5 and 1.2.6 not working at all for me - what am I missing?
OK, I'm sure that someone would have mentioned that the latest
releases don't work, so that can't be it. It's obvious that I'm
missing something.
I've been using jQuery 1.2.3 for months now, and today I wanted to use
the ui.slider plugin which requires offsetWidth() which is not in
1.2.3. So I figured I'd just download the latest release, i.e. 1.2.6
and be done with it. I did just that, but when I ran my app, there
were a whole bunch of JS errors. I figured that's to be expected, my
code isn't perfect. So I started debuging them. So far, I'm still
trying to debug the very first one.
I have something as simple as:
jQuery(document).ready(function() {
alert(jQuery('body').html());
});
If I use 1.2.3 everything works and onLoad I get the html of the body
element. If I change the one line to 1.2.5 or 1.2.6, I get an alert
with undefined. The reason I'm using jQuery() instead of $() is
that I am also using prototype for their portal plugin. I wish I
wasn't but the jQuery verion just isn't cutting it yet. And yes, I
have the jQuery.noConflict(); line first in my JS code.
So, what am I missing? Do I need to download any other file besides
jquery-1.2.5.pack.js for example? Are the new releases not working
with prototype? Are they using different syntax? I mean, I assume
that if the new releases would have such drastic changes, they
wouldn't be 1.2.6 they would be 2.0.
Anyway, hopefully someone can point out whatever it is that I'm
missing here.
Thanks,
Kape
