[jQuery] Ajax and 404 errors.
I'm trying to load some javascript files via ajax, and for the life of
me, I can't get it to catch 404 errors. I've tried searching, but
everything I've found says that I should check the status on the
request object to catch it but it's not even getting that far.
I've tried:
$.ajax({
url: http://some.bogus/javascript.js;,
success: function() {
do_something();
},
error: function(myrequest,mystatus,myerror) {
do_something_else();
}
});
I would try $.getScript, but that appears to have no way of handling
errors.
I've even tried just doing a console.info(test) -- it doesn't even
do that. Firebug shows a 404 error (obviously) but the error doesn't
seem to be being caught?
I'm loading jquery through the google api, version 1.3.2
Ideas? I've done this before and never had any issues, but it's been
a couple of months and I can't for the life of me figure out why I'm
having this problem.
[jQuery] Odd behavior with 'this'?
Here's some behavior I've run into that is not quite what I expected.
So the question is, should I expect something different or is this a
bug / gotcha?
I'm working on a plugin for manipulating tables (the ones that are
published do not suit my needs).
So I have the following inside my plugin:
$.fn.myplugin = function(opts) {
do_something(this);
$(this).children('thead th:last').click(function() {
do_something_else(this);
};
};
function do_something_else(obj) {
my_clicked = $(obj).parents('thead');
};
An example table:
table
thead
thA/ththB/th
/thead
tbody
/tbody
/table
Now, I expect that my_clicked will be an object for thead, but in
actuality, it isn't anything, because obj is an object for thead,
not for thB/th as I expect it to be (since that was what was
clicked, and should have been passed as 'this').
Could someone please explain why it's working that way to me, and how
I might get what I expect instead of what it is getting?
[jQuery] Re: show/hide opacity gets stuck sometimes
I've never worked with the .stop function before, so I searched for it
in google (jquery .stop) to read up on it to see if that might shed
some light... One of the very first links I found was this:
http://www.pengoworks.com/workshop/jquery/stop_bug.htm
Glancing over it, I think this is what is causing your problem. The
individual who created that page links to a patch they created for the
issue, and has a fairly straightforward demonstration. Hope that
helps.
On Dec 9, 11:11 am, Tijmen Smit [EMAIL PROTECTED] wrote:
I'm working on a page where once you hover over a small photo, a
bigger photo should appear underneath it with a small text. The box
holding the photo does appear, and once you slowly move towards
another photo it works fine.
But once you quickly move from the top left to the top right, it get a
bit weird. Sometimes the box with the big photo disappears completely
or it get stuck with the opacity not set to full visibility.
And in IE7 there's another thing going on, the moment you place your
mouse on the small photo it first seems to be disappearing, but it
later does come up the way its supposed to be. I did set the z-index
on both of the div's, but I have the feeling it doesn't have anything
to do with the z-index.
You can see it in action here
-http://www.tijmensmit.com/dev/intranet/test.html
$(#smoelenboek li).hover(function() {
var $list_class = $(this).attr(class);
$(#smoelenboek).find('li.' + $list_class).addClass
(on);
$(this).find(div).stop().animate({opacity: show, top:
30px}, slow);
}, function () {
$(this).find(div).stop().animate({opacity: hide, top:
20px}, fast);
$(#smoelenboek li).removeClass(on);
});
I know I could change the .stop().animate() to a simple .hide()/.show
(), which works fine. But I would like to keep the animate opacity
effect, but then without them sometimes disappearing :)
Any idea's how to fix this problem?
Thanks!
Tijmen
[jQuery] Re: show/hide opacity gets stuck sometimes
You're welcome. Glad it proved useful.
On Dec 9, 1:22 pm, Tijmen Smit [EMAIL PROTECTED] wrote:
Thanks a lot :)
The clearQueue option for the stop() did the trick, for some reason I
completely missed it on docs.jquery.com
On Dec 9, 6:04 pm, Leanan [EMAIL PROTECTED] wrote:
I've never worked with the .stop function before, so I searched for it
in google (jquery .stop) to read up on it to see if that might shed
some light... One of the very first links I found was this:
http://www.pengoworks.com/workshop/jquery/stop_bug.htm
Glancing over it, I think this is what is causing your problem. The
individual who created that page links to a patch they created for the
issue, and has a fairly straightforward demonstration. Hope that
helps.
On Dec 9, 11:11 am, Tijmen Smit [EMAIL PROTECTED] wrote:
I'm working on a page where once you hover over a small photo, a
bigger photo should appear underneath it with a small text. The box
holding the photo does appear, and once you slowly move towards
another photo it works fine.
But once you quickly move from the top left to the top right, it get a
bit weird. Sometimes the box with the big photo disappears completely
or it get stuck with the opacity not set to full visibility.
And in IE7 there's another thing going on, the moment you place your
mouse on the small photo it first seems to be disappearing, but it
later does come up the way its supposed to be. I did set the z-index
on both of the div's, but I have the feeling it doesn't have anything
to do with the z-index.
You can see it in action here
-http://www.tijmensmit.com/dev/intranet/test.html
$(#smoelenboek li).hover(function() {
var $list_class = $(this).attr(class);
$(#smoelenboek).find('li.' + $list_class).addClass
(on);
$(this).find(div).stop().animate({opacity: show, top:
30px}, slow);
}, function () {
$(this).find(div).stop().animate({opacity: hide, top:
20px}, fast);
$(#smoelenboek li).removeClass(on);
});
I know I could change the .stop().animate() to a simple .hide()/.show
(), which works fine. But I would like to keep the animate opacity
effect, but then without them sometimes disappearing :)
Any idea's how to fix this problem?
Thanks!
Tijmen
[jQuery] jquery history_remote IE bug?
I'm not sure if this is a bug so I thought I'd ask folks and see what they had to say. I have some export links on a page, and despite me not using $.remote or $.history (I use $.click) when a user clicks on these export links in IE, if they use the browser back button afterwards, it tries to re- do the export. I'm not exactly sure what to do about this. I've looked at my code and looked at the plugin code, and nothing jumps out as me as the cause of this issue. Firefox handles it beautifully.
[jQuery] Re: Intercept Back button click on browser
Well, originally I had thought that the duplication went away. It appears now that the duplication only happens when I load datasets that are longer than (some yet to be determined) length / time. I was browsing through the code of the plugin and I noticed there was some timer stuff added for Opera (I think, haven't looked again and am operating on memory). Perhaps I need to add something similar to Firefox and / or IE? Ideas? On Oct 9, 4:36 am, Klaus Hartl [EMAIL PROTECTED] wrote: On 8 Okt., 18:57, Leanan [EMAIL PROTECTED] wrote: The duplication is something else. However the fix you made works. That means you still have that duplication? Or not? --Klaus
[jQuery] Re: Intercept Back button click on browser
Via more investigation, I think I've come across the issue. The
question is whether this is a bug / needed feature.
It appears that when you use $.history, the click happens twice --
once when you click on whatever you want to click that triggers some
jquery and secondly when the history plugin does it's $.click.
This means, that if you were to add a simple
$('div#my_div').history(function() {
$('div#hide').hide();
$('div#show').show();
});
That the .hide() and .show() will get executed twice. This in itself
isn't particularly harmful as far as display goes --
calling .hide() / .show() on elements that are already hidden/shown
won't unhide / unshow them. The question I have is, should adding a
toggle to the history be done via $.remote or $.history? If it's
$.history, then I see a potential problem... if I had the following:
$('div#my_div').history(function() {
$('div#toggle').toggle(function() {
$('div#hide_show').hide();
}, function() {
$('div#hide_show').show();
});
});
It would seem that what would happen is that the toggle would appear
to not work. I haven't tested this yet, but based on the behavior I
am seeing this is the behavior I would expect to see in the test.
Part of this is brought about by the fact that I am, admittedly,
trying to do something that I don't think any of the history plugins
intended -- I want to log a function that will either do an ajax call
or a simple DOM manipulation depending on some condition. I myself am
split on whether or not this is something the plugin should handle,
though I do feel that the $.history method should prevent the second
click like the $.remote function does for firefox.
On Oct 10, 9:01 am, Leanan [EMAIL PROTECTED] wrote:
Well, originally I had thought that the duplication went away.
It appears now that the duplication only happens when I load datasets
that are longer than (some yet to be determined) length / time. I was
browsing through the code of the plugin and I noticed there was some
timer stuff added for Opera (I think, haven't looked again and am
operating on memory). Perhaps I need to add something similar to
Firefox and / or IE? Ideas?
[jQuery] Re: Intercept Back button click on browser
Fantastic, thank you.
Where might I be able to get this?
Also, it seems sometimes that even though I'm using
$('a#myidxxx').history(function() {
$.get(myurl,function(data) {
$(myappenddiv).append(data);
});
});
that the data is still getting appended twice.
This doesn't happen all the time though. I'll try using your fix if I
can find it and see if that might take care of the issue. Right now
this is only in firefox, as I haven't been able to get my stuff to
work to the point of calling the .history in IE. (I hate how IE just
fails silently sometimes).
[jQuery] Re: Intercept Back button click on browser
The duplication is something else. However the fix you made works.
[jQuery] Re: Intercept Back button click on browser
In that situation, 'this' does not appear to be a reference to the
link we've clicked, and when I use firebug and do some console output,
this is what I get:
this.id = undef
/\d/.exec(this.id) is null
I had actually tried something along those lines before, changing my
click handler on the links I wanted added to the history to $
(selector).history. I can't figure out what I need to query in order
to get at the clicked link's info.
On Oct 7, 9:37 am, Klaus Hartl [EMAIL PROTECTED] wrote:
Nevertheless you are using the plugin in a way it isn't supposed to be
used, this is what I wanted to point out and this is where the double
loading comes from. One from the click handler itself and a second
time because that click event is triggered again by the plugin.
Besides if you're not using remote() or history() it will not work in
IE (doesn't work in Safari 3 anyway as it stands).
What is wrong with the following much less redundant code using the
history() method:
$('a.testing').history(function() {
var i = /\d/.exec(this.id)[0];
$.get('chapter-' + i + '.html', function(data) {
$('#div1').hide();
$('#div2').append(data).show();
});
});
--Klaus
On 7 Okt., 14:26, Leanan [EMAIL PROTECTED] wrote:
Not having a test for Chap3 was a typo. That last if should be
adjusted accordingly.
Klaus-
I don't want to use .remote, because I only want to make the ajax call
once. If the content we expect to be there isn't there, then I want
to load it. If, however, we've already loaded it, I just want to re-
show the div that contains it, not hit the server again (the data I'm
getting is large and takes some time to generate. As the content is
not something likely to change in a few minutes, the solution I've
come up with is sufficient in that regard). I already have this
functionality working flawlessly. All I really need to do is that
when the back button is hit, div#2 gets hidden and div#1 is shown,
and, if someone hits forward from that point, then div#1 is hidden and
div#2 is shown. This is working, too, except for what appears to be a
double call to $.get.
When I do something similar to the demo, the links with the #something
get added. I don't want to log every single link that gets clicked
(they expand tables, adjust which divs get shown, etc). This is why I
just have the call to initialize, to add the ability to swap the
visibility of the divs when they go back to the base url.
I don't understand though why it is appearing to call my $.get twice.
Is it because when the link with the # is clicked and put in the
history the plugin is executing the $.get as well? This seems odd,
since I have neither any $.history or $.remote calls in my script. I
would change my .click to a .history, except that I have a table of
links that could be selected, and I need to know which link was
clicked, because I need to grab info from the link for the resulting
call.
There must be a way to do this?
On Oct 7, 2:36 am, Klaus Hartl [EMAIL PROTECTED] wrote:
History/Remote is not supposed to work that way. Although the hash is
changing correctly it will not work in IE for example. You need to
explicitly tell the history manager which links add to history. Just
have a look at the demo. For pure Ajax loading links that is the
remote method. In your case
$('a.testing').remote('#div2', function() {
//callback
});
$.ajaxHistory.initialize();
The show/hide of div1/div2 looks to me like a workaround you don't
need but I'm not sure.
--Klaus
On 6 Okt., 22:52, Leanan [EMAIL PROTECTED] wrote:
Klaus,
I've created a demo that exhibits this behavior. I modified your demo
that is included with the script
athttp://www.stilbuero.de/jquery/history/
All you should have to do is change your index.html to be the
following:
html lang=en
head
meta http-equiv=Content-Type content=text/html;
charset=utf-8
meta http-equiv=Content-Style-Type content=text/css
meta http-equiv=Content-Script-Type content=text/
javascript
titlejQuery history/remote - solution for hijaxing links/
title
script src=jquery-1.1.3.1.pack.js type=text/javascript/
script
script src=jquery.history_remote.js type=text/javascript/
script
/head
body
div id=div1
a href=#test1 class=testing id=Chap1Test Chap1/abr
a href=#test2 class=testing id=Chap2Test Chap2/abr
a href=#test3 class=testing id=Chap3Test Chap3/abr
/div
div id=div2 /div
script type=text/javascript
$(document).ready(function() {
$.ajaxHistory.initialize(function() {
$('#div1').show();
$('#div2').hide();
});
$('.testing').click(function() {
if ($(this).attr('id') == Chap1
[jQuery] Re: Intercept Back button click on browser
I forgot to note that when I do a console.info(this) inside that function, I get the following in firebug: Window index.html
[jQuery] Re: Intercept Back button click on browser
Not having a test for Chap3 was a typo. That last if should be
adjusted accordingly.
Klaus-
I don't want to use .remote, because I only want to make the ajax call
once. If the content we expect to be there isn't there, then I want
to load it. If, however, we've already loaded it, I just want to re-
show the div that contains it, not hit the server again (the data I'm
getting is large and takes some time to generate. As the content is
not something likely to change in a few minutes, the solution I've
come up with is sufficient in that regard). I already have this
functionality working flawlessly. All I really need to do is that
when the back button is hit, div#2 gets hidden and div#1 is shown,
and, if someone hits forward from that point, then div#1 is hidden and
div#2 is shown. This is working, too, except for what appears to be a
double call to $.get.
When I do something similar to the demo, the links with the #something
get added. I don't want to log every single link that gets clicked
(they expand tables, adjust which divs get shown, etc). This is why I
just have the call to initialize, to add the ability to swap the
visibility of the divs when they go back to the base url.
I don't understand though why it is appearing to call my $.get twice.
Is it because when the link with the # is clicked and put in the
history the plugin is executing the $.get as well? This seems odd,
since I have neither any $.history or $.remote calls in my script. I
would change my .click to a .history, except that I have a table of
links that could be selected, and I need to know which link was
clicked, because I need to grab info from the link for the resulting
call.
There must be a way to do this?
On Oct 7, 2:36 am, Klaus Hartl [EMAIL PROTECTED] wrote:
History/Remote is not supposed to work that way. Although the hash is
changing correctly it will not work in IE for example. You need to
explicitly tell the history manager which links add to history. Just
have a look at the demo. For pure Ajax loading links that is the
remote method. In your case
$('a.testing').remote('#div2', function() {
//callback
});
$.ajaxHistory.initialize();
The show/hide of div1/div2 looks to me like a workaround you don't
need but I'm not sure.
--Klaus
On 6 Okt., 22:52, Leanan [EMAIL PROTECTED] wrote:
Klaus,
I've created a demo that exhibits this behavior. I modified your demo
that is included with the script athttp://www.stilbuero.de/jquery/history/
All you should have to do is change your index.html to be the
following:
html lang=en
head
meta http-equiv=Content-Type content=text/html;
charset=utf-8
meta http-equiv=Content-Style-Type content=text/css
meta http-equiv=Content-Script-Type content=text/
javascript
titlejQuery history/remote - solution for hijaxing links/
title
script src=jquery-1.1.3.1.pack.js type=text/javascript/
script
script src=jquery.history_remote.js type=text/javascript/
script
/head
body
div id=div1
a href=#test1 class=testing id=Chap1Test Chap1/abr
a href=#test2 class=testing id=Chap2Test Chap2/abr
a href=#test3 class=testing id=Chap3Test Chap3/abr
/div
div id=div2 /div
script type=text/javascript
$(document).ready(function() {
$.ajaxHistory.initialize(function() {
$('#div1').show();
$('#div2').hide();
});
$('.testing').click(function() {
if ($(this).attr('id') == Chap1) {
$.get('chapter-1.html', function(data) {
$('#div2').append(data);
$('#div1').hide();
$('#div2').show();
});
}
if ($(this).attr('id') == Chap2) {
$.get('chapter-2.html', function(data) {
$('#div2').append(data);
$('#div1').hide();
$('#div2').show();
});
}
if ($(this).attr('id') == Chap1) {
$.get('chapter-1.html', function(data) {
$('#div2').append(data);
$('#div1').hide();
$('#div2').show();
});
}
});
});
/script
/body
/html
You should notice that every time you click on the Test links, you
will actually get the html page twice instead of once.
[jQuery] Re: Intercept Back button click on browser
All right...
I've found a solution to the problem, though it is not the solution I
had hoped for.
I basically had to do a $.getscript and generate script that had a $
(selector).history() for each link. Not ideal, but it works. I
do wonder though if I was doing something wrong in my calls to make it
so that
$('a.stuff').history(function() {
console.info(this);
)};
was returning this as Window index.html instead of the object for the
link. Is this a bug or just user error?
On Oct 7, 9:59 am, Leanan [EMAIL PROTECTED] wrote:
I forgot to note that when I do a console.info(this) inside that
function, I get the following in firebug:
Window index.html
[jQuery] Re: Intercept Back button click on browser
*sigh* Ok. I've decided upon the jquery.history_remote.js plugin by Klaus. I have it working, except there is one slight problem, and I can't figure out how to fix it. I have a table of links that, when you click on a link, they pull up more detailed data, load it into a div, so on and so forth as I've described earlier. I've changed the href to be #detailed_infosome number. I made the call to initialize, giving it a call back function that will show the original div you see and hide the div(s) with the detailed info, as I'd like it to. The problem is that the data you get from clicking on the link with the #detailed_info href is an ajax call. And it appears that when I enable ajaxHistory that all the links now make two ajax requests instead of one! I can stop it from doing this by making a preventDefault call on the event, but then it doesn't get added to the history. If I completely remove the history stuff, the links only make one ajax call, and the data is only retrieved once as I expect, but then now the back link doesn't work as I need it. I'm about ready to rip my hair out... does anyone have any suggestions?
[jQuery] Re: Trouble getting 1 hover to work at a time
I haven't tested this, but I would try something along the following:
$('.appHelpPopup').children('span').show();
The problem is that you have more than one DOM element classed as
appHelpPopup with a span under it, so that selector is grabbing all of
them, and applying show to all of them. You might need to change it
to child instead of children, I always get those mixed up.
[jQuery] Re: Intercept Back button click on browser
I'll see if I can create a demo that has the same behavior. On Oct 6, 4:25 pm, Klaus Hartl [EMAIL PROTECTED] wrote: Is it possible for you to put up a demo? --Klaus On 6 Okt., 22:11, Leanan [EMAIL PROTECTED] wrote: *sigh* Ok. I've decided upon the jquery.history_remote.js plugin by Klaus. I have it working, except there is one slight problem, and I can't figure out how to fix it. I have a table of links that, when you click on a link, they pull up more detailed data, load it into a div, so on and so forth as I've described earlier. I've changed the href to be #detailed_infosome number. I made the call to initialize, giving it a call back function that will show the original div you see and hide the div(s) with the detailed info, as I'd like it to. The problem is that the data you get from clicking on the link with the #detailed_info href is an ajax call. And it appears that when I enable ajaxHistory that all the links now make two ajax requests instead of one! I can stop it from doing this by making a preventDefault call on the event, but then it doesn't get added to the history. If I completely remove the history stuff, the links only make one ajax call, and the data is only retrieved once as I expect, but then now the back link doesn't work as I need it. I'm about ready to rip my hair out... does anyone have any suggestions?
[jQuery] Re: Intercept Back button click on browser
Klaus,
I've created a demo that exhibits this behavior. I modified your demo
that is included with the script at http://www.stilbuero.de/jquery/history/
All you should have to do is change your index.html to be the
following:
html lang=en
head
meta http-equiv=Content-Type content=text/html;
charset=utf-8
meta http-equiv=Content-Style-Type content=text/css
meta http-equiv=Content-Script-Type content=text/
javascript
titlejQuery history/remote - solution for hijaxing links/
title
script src=jquery-1.1.3.1.pack.js type=text/javascript/
script
script src=jquery.history_remote.js type=text/javascript/
script
/head
body
div id=div1
a href=#test1 class=testing id=Chap1Test Chap1/abr
a href=#test2 class=testing id=Chap2Test Chap2/abr
a href=#test3 class=testing id=Chap3Test Chap3/abr
/div
div id=div2 /div
script type=text/javascript
$(document).ready(function() {
$.ajaxHistory.initialize(function() {
$('#div1').show();
$('#div2').hide();
});
$('.testing').click(function() {
if ($(this).attr('id') == Chap1) {
$.get('chapter-1.html', function(data) {
$('#div2').append(data);
$('#div1').hide();
$('#div2').show();
});
}
if ($(this).attr('id') == Chap2) {
$.get('chapter-2.html', function(data) {
$('#div2').append(data);
$('#div1').hide();
$('#div2').show();
});
}
if ($(this).attr('id') == Chap1) {
$.get('chapter-1.html', function(data) {
$('#div2').append(data);
$('#div1').hide();
$('#div2').show();
});
}
});
});
/script
/body
/html
You should notice that every time you click on the Test links, you
will actually get the html page twice instead of once.
[jQuery] Re: Intercept Back button click on browser
I've looked at the plugins, but I don't think they are what I want. I basically have two divs, div#a and div#b. When I click on a link in div#a, I want to do one of two things: If this is the first click on the link in div#a, do some ajax and then hide div#a and show div#b (where the ajax stuff has been stuffed). If this isn't the first click on the link in the div#a, then just hide div#a and show div#b. Now in div#b, I have a Back link that hides div#b and shows div#a. What I want to have happen is that when I click the back button in the browser I want to hide div#b and show div#a. The plugins look like they actually reload the ajax content, which I don't want to do. I just want to hide one div and show the other. Is that possible?
[jQuery] Intercept Back button click on browser
So here's the situation: I have a page that could potentially contain a massive amount of data. To try to decrease initial load time, I've broken it all out into nice chunks that get loaded via ajax. This works great. Some of the chunks need to appear as if they are their own page. To save on speed, all I do is hide all the prior content on the page and show the newly loaded content. When the user wants to go back, they click a link on this new page, which hides that content and re-shows the prior content. It works beautifully. Now the problem: How can I make it so that when the user clicks the back button in their browser, this same thing happens, as I'll likely have people trying to click the back button instead of the back link on the page and then tell me it's broken. Is it even possible?
[jQuery] Re: Repeating a function call on hover/mouseover/etc
Thanks for the answer. Unfortunately it doesn't seem to want to play
well with the plugin and I didn't want to have to do significant
changes.
The plugin I'm using is jquery.scrollable.js.
Anyone know of a nice scrolling plugin that already has built in to it
the ability to continue scrolling when hovering over the next nav
item? All the scrolling plugins I find use either timers or clicks.
I haven't dug into all their code yet; I don't mind doing minor
changes to the plugin. The keyword here being: Minor. (couple of
lines)
On Aug 29, 5:32 pm, micah [EMAIL PROTECTED] wrote:
one way to approach what you're trying to do is with a simple
setInterval (http://developer.mozilla.org/index.php?title=En/DOM/
Window.setInterval), so that the parser has a bit of breathing room
between calls to someFunc.
if you just loop through, you're essentially saying call someFunc as
many times as you can, as fast as you can possibly call it, which
isn't really cpu-friendly ;)
try this instead:
var int = null;
$('#element').hover(function() {
int = setInterval(someFunc, 100);}, function() {
clearInterval(int);
});
-micah
On Aug 29, 2:00 pm, Leanan [EMAIL PROTECTED] wrote:
Hey guys.
I've poured over the docs, and mouseover/hover/etc only trigger once.
I want it to continue to trigger a function while the element is
hovered.
I've tried:
$('#element').hover(function() {
while(true) {
someFunc;
}
}, function() {});
Unfortunately, this screws things up. The while loop hangs the
browser for a while before it finally throws the this script has been
running too long message.
I've tried looking at some of the scrolling plugins to see how they do
it but the only one I can find that seems to have this functionality
(do something while hovering over an element, in this case, continue
scrolling) has no documentation, and the examples do not explain how
to use the plugin, they merely show it working. What little bit of
text is on the page is non-english and from the looks of it is little
more than headers anyway, so useless even if I translated it.
So, how should I go about continuing to trigger someFunc while I'm
hovered over a particular item on the page?
[jQuery] Repeating a function call on hover/mouseover/etc
Hey guys.
I've poured over the docs, and mouseover/hover/etc only trigger once.
I want it to continue to trigger a function while the element is
hovered.
I've tried:
$('#element').hover(function() {
while(true) {
someFunc;
}
}, function() {});
Unfortunately, this screws things up. The while loop hangs the
browser for a while before it finally throws the this script has been
running too long message.
I've tried looking at some of the scrolling plugins to see how they do
it but the only one I can find that seems to have this functionality
(do something while hovering over an element, in this case, continue
scrolling) has no documentation, and the examples do not explain how
to use the plugin, they merely show it working. What little bit of
text is on the page is non-english and from the looks of it is little
more than headers anyway, so useless even if I translated it.
So, how should I go about continuing to trigger someFunc while I'm
hovered over a particular item on the page?
[jQuery] Re: help with array for flot
This is kinda pseudocodish, but it should do what you want:
$('button selector').click(function() {
$('table tr').each(function() {
x = $(this + 'td:eq(1)'); //should grab the second td
y = $(this + 'td:eq(2)'); //should grab the third td
push(array,[x,y]);
});
});
Of course if you have multiple tables you'll be iterating over all of
them, so you may need to an id to the table so that you can use that
to select the proper table.
[jQuery] Re: click(fn) question
Thanks for the assistance, guys. All is well now.
[jQuery] Re: click(fn) question
Sorry guys. There are two options you can specify for UI tabs, I forget off the top of my head what they are (there's an example of it's usage in the docs for UI tabs). One is for a function to be run when a tab is clicked, the other for after the tab is loaded. So all I had to do was set the text to loading in the clicked option, do the redrawing of graphs, and then in the after load function, change the text back to what it was.
[jQuery] click(fn) question
I apologize if this gets posted twice, but it looks like my last
attempt to post got swallowed by the ether.
I'll make it short:
I have flot and ui tabs. Because I'm processing a rather large set of
data, and excanvas, switching the datasets graphed takes a few
seconds. I want to add feedback, so that when a tab is clicked, it's
title changes to Loading... and then when the graph is drawn, it
switches back to it's original text. I have this working, but the
changes only show when I step through with a debugger. When I run
normally, it appears as if the changes to the text to Loading... and
back to the default aren't being displayed until the click handler is
finished, which makes it appear as if nothing is actually happening.
I've searched through the jquery books I have (learning jquery and the
jquery reference) as well as online documentation and I can't find
anything that confirms or denies this behavior as being proper.
Does anyone know how I can get the following to work and actually
display the results of the .text() calls inside the click() instead of
after the .click() has processed? Thanks in advance
(pseudo)
$(tab_selector).click(function() {
$(clicked_tab).text(Loading);
[Flot calls to change the datasets and redraw the graph]
$(clicked_tab).text(Previous Text);
});
[jQuery] Question about .click
Hello there ladies and gents, hopefully someone can point me in the right direction. I'm using a combination of flot and ui tabs, and I want the following behavior: When the user clicks on the tab, the text and background get changed to display a loading message while the flot graph is drawn and processed. When the graph is drawn, the tab returns to normal. I have this functionality, but the problem is that it's not showing. When I step through the javascript with firebug, everything works perfectly--the tab changes to display the loading, the graph gets drawn, and then the tab returns to normal. However when I'm not debugging, everything seems to process so fast that nothing appears to happen. The problem is that it's not really processing so fast--there is a noticeable few seconds delay between the time the tab is clicked and the graph gets redrawn, hence why I want this feedback. So I suppose instead of saying it seems to process so fast what I really mean is that it appears that the changes to the tab that get done within the click function don't actually get displayed until the click function finishes processing -- which makes it appear as if nothing has been done. I've scoured the learning jquery and jquery reference books, as well as tried to dig around on the 'net and can't find anything to confirm or deny this apparent behavior. Does anyone happen to know one way or the other, or know of any documentation that addresses this issue? Does anyone happen to know how I can get this to work? Thanks very much in advance.
[jQuery] Re: click(fn) question
I hadn't thought about that... I'll look into it.
[jQuery] Re: jquery tabs: removing old loaded content from DOM
There are a lot of different tabs plugins but I'm guessing you're using the jquery UI tabs? You should try using firefox w/ firebug, and take a look at the classes the tabs are given when they are selected / hidden (or read the docs on that plugin as they should have that info as well). I don't remember what they are. Basically however you'd do something like this: $ (selector_for_all_hidden_tabs).remove([selector_for_what_you_want_to_remove]). So for example, if your hidden tab class was hidden-tab and you had a div in there id'd content which contained all your content, I believe you'd use the following: $(.hidden-tab).remove(#content);
[jQuery] Get number of times a link has been toggled or clicked?
Hey guys. I was curious if it was possible to query how many times something that has toggle bound to it has been clicked. Is this possible?
[jQuery] IE doesn't like .css(stuff)?
Afternoon ladies and gents.
I'm experiencing a weird issue. I have a div that contains popup
information for when users hover over specific items on the page.
Everything looks beautiful in firefox, but IE takes a dump (go
figure).
I was wondering if anyone might have an idea why?
Here's what I got:
When someone hovers over the appropriate thing:
$(#mypopup).html(myText).show().css({'top' : ypos, 'left': xpos});
ypos and xpos are the coordinates of the mouse on the screen.
When I look at it in Firefox, the div is shown and pops up next to
the mouse (I do a little ofsetting with xpos and ypos).
However in IE, it causes the div to just be shown, which pushes
everything under it down (and causes things to flicker because now the
mouse isn't on the item that should trigger the popup).
I've tried searching known css() issues in IE, but haven't found
anything that pertains to this situation (modifying the top and left
of an element).
Thanks in advance.
[jQuery] Re: IE doesn't like .css(stuff)?
Fixed it.
[jQuery] Re: jqGrid final preview
I have to say good job! I really like what I see. This looks like it might be exactly the type of thing I need...
[jQuery] Re: jqGrid final preview
Hmm, I only have one thing I'm not sure I like: it looks like all the sorting is done on the backend? Do I have to write my own sort routines then? Are there any plans to integrate it with tablesorter, or to have sorting like tablesorter (client side, not server side)?
[jQuery] Re: jqGrid final preview
I stand corrected, Tony. Fantastic! Thank you for the clarification. That'll teach me to be eager.
[jQuery] Re: [POLL] Online jQuery Training from John Resig
Hmm, interesting indeed. I said I'm interested but whether or not I would do it depends on most of the things mentioned above: cost time ability to get recordings The last one is especially important to me, as I have an infant and as anyone with kids can attest, trying to get something done at this stage in the game is a crap shoot.
[jQuery] Plugin Authoring Help pt 2
Ok, I'm really trying to wrap my head around this, and it's irritating
me. I've checked out the following pages:
http://docs.jquery.com/Plugins/Authoring
http://www.learningjquery.com/2007/10/a-plugin-development-pattern
And they help some but there's one problem I'm running into.
I have:
$.fn.myPlugin = function(options) {
$.myPlugin.defaults = $.extend($.myPlugin.defaults, options);
return(this);
};
$.myPlugin = {
defaults: {
def1: 'default1',
def2: 'default2',
...
defx: 'defaultx'
},
myFunc: function() {
var options = $.myPlugin.defaults;
//do something here, anything really
},
myFunc2: function() {
var options = $.myPlugin.defaults;
//do something here, again, anything
}
};
Now, I want to do something like this:
jQuery().myPlugin({def1: 'other_def1', def2: 'other_def2'}).myFunc();
Can I?
Because it's not working. It tells me that jQuery().myPlugin({def1:
'other_def1', def2: 'other_def2'}) is not a function.
However, if I change it so that myFunc is $.fn.myFunc = function()
{ }, then I can, but I have to do it as:
jQuery().myPlugin({def1: 'other_def1', def2:
'other_def2'}).myPlugin.myFunc();
Which I don't like.
None of the tutorials or documentation I can find is clear on this
point, though they do refer to the functions in $.myPlugin as being
user-accessable... and they are, but only if I do $.myPlugin.myFunc.
I can't chain. And I want to be able to do that.
[jQuery] Re: Plugin Help
Hmmm, ok.
So with that setup, I (as a user) could do
$.myAwesomePlugin.startRockin? I notice you have the options stuff
under simply $.fn.myAwesomePlugin. So what if I wanted to call
startRockin and set defaults, too? Does
$.myAwesomePlugin.startRockin(options_go_here) do it? Or do I have to
do $.myAwesomePlugin(options_here), then
$.myAwesomePlugin.startRockin?
I've been reading these two articles over and over, and I've kind of
got it (I think) but one or two things I still don't quite grasp. The
articles are:
http://docs.jquery.com/Plugins/Authoring
http://www.learningjquery.com/2007/10/a-plugin-development-pattern
I rather like the second article, it seems failry straightforward. My
only complaint is that it doesn't show any example calls at the end
when all the code is put together. And that is where I keep getting
hung up.
For my example:
I have my plugin that looks more or less like what I have in my intial
post. When I try to call $.myAwesomePlugin.startRockin, firebug tells
me that $.myAwesomePlugin.startRockin has no properties. From reading
the second article, it looks like maybe I want to do
$.fn.myAwesomePlugin.startRockin. Which is great, but I have a few
different functions that use the same defaults/options, and I really
don't want to reproduce the options = $.extend code.
If someone could kindly tell me what I'm missing or getting mixed up
I'd greatly appreciate it. I know I'm close.
On Mar 1, 8:59 am, Scott González [EMAIL PROTECTED] wrote:
The most common approach is something like this:
(function($) {
$.fn.myAwesomePlugin = function(options) {
options = $.extend({}, $.myAwesomePlugin.defaults, options);
$.myAwesomePlugin.rockOn();
};
// Make helper/utility functions accessible to users, so they can
access
// them directly if they need to.
// Make defaults available for users to override.
$.myAwesomePlugin = {
defaults: {
[some defaultish stuff here]
},
rockOn: function() {
$.myAwesomePlugin.startRockin();
$.myAwesomePlugin.keepRockin();
},
startRockin: function() {
// rockin' code
},
keepRockin: function() {
// more rockin' code
}
};
})(jQuery);
On Feb 29, 2:45 pm, Leanan [EMAIL PROTECTED] wrote:
I apologize if this seems noobish.
So let's say I want to write my own plugin (who woudln't?)
So I spec it out like this:
(function($) {
$.fn.myAwesomePlugin = function(options) {
var defaults = {
[some defaultish stuff here]
};
var options = $.extend(defaults,options);
function rockOn() {
// I want to call another function in myAwesomePlugin here
};
})(jQuery);
How do I call the other function in rockOn? Say it's called
startRockin.
Do I do $.myAwesomePlugin.startRockin?
Do I simply do startRockin?
Would it be $this.startRockin?
I've been searching for this and so far I haven't seen much in any of
the tutorials I've found... and the plugins I have to dig through
don't seem to either: 1) have multiple functions 2) have those
functions call each other.
Thanks!
[jQuery] Re: Tablesorter plugin
I fixed it: The content I was having issues with was loaded via AJAX, and on that page I included jQuery and the jQuery tablesorter script. Well, it also turns out that the page I was loading this content into also included jQuery. Apparently IE doesn't like that very much. Firefox, however, could care less. Just thought I'd share with folks so they can avoid this problem. Don't load jQuery twice, or IE will puke over itself.
[jQuery] Tablesorter plugin
Anyone had any issues with the latest version of this in IE?
I have a page that uses this, and I've made use of the sortStart and
sortEnd triggers. For whatever reason, the sortEnd trigger never
fires -- so the message box I have show never goes away. Also, the
zebra striping isn't working at all -- not even when I leave the
widgetZebra property at its default and change my css to use even
and odd instead of my-even-class and my-odd-class.
I've tried making sure my usage of the triggers is EXACTLY like that
listed on the example page -- and still no love. Any ideas what I
could be missing?
I have something like the following:
$(document).ready(function() {
$('#display-div).hide();
$('table').tablesorter({
widgets: ['zebra'],
widgetZebra: {css: [my-even-class,my-odd-class]},
cssHeader:'',
cssAsc: 'asc',
cssDesc: 'desc',
});
$('table').bind(sortStart,function() {
$('#display-div).css(css stuff here).show();
}).bind('sortEnd',function(){
$('#display-div).fadeOut('slow');
});
});
I've tried changing the .fadeOut('slow') to .hide(). No love. I've
tried getting rid of the .css call in sortStart, so that it just ends
up being $('#display-div).show(); No love. I've even tried striping
down the .tablesorter call to not specify anything beyond widgets:
['zebra'], and still it doesn't work! It says that the plugin works in
ie6 -- but my tests show this not to be the case. However, when I go
to http://tablesorter.com/docs/example-triggers.html with ie6 -- works
like a charm. I must be missing something very subtle. About the
only thing I haven't tried is using the packed version of tablesorter
because I have made some modifications to it for my use (changed the
%sort to sort floats as well as integers, since I have to sort values
like 10.35%). It works beautifully in firefox. . . zebra striping,
triggers, and sorting -- all of it!
Any assistance would be appreciated.
[jQuery] Re: Tablesorter plugin
Well, I've gotten the triggers to work, but I had to strip
*everything* out. And I had to add a hide.
So now I have:
$(document).ready(function(){
$(#'display-div.hide();
$('table').tablesorter();
$('table').bind(sortStart,function(){
$('#display-div.show();
}).bind('sortEnd',function(){
$('#display-div.hide();
});
});
But now it won't sort!
[jQuery] multiselect help?
I'm hoping one of you guys can help me out.
I've got a multiselect that I can't get to work with the multiselect
plugin I obtained from http://lab.arc90.com/tools/jquery_multiselect/
Unfortunately, for whatever reason, I can't get to the main page so I
can't look up the examples listed there.
Anyway, I have a multiselect that looks something like this:
select id=jqmulti name=my_name class=my_class
multiple=multiple size=4 title=my_title
option value=Option 1/option
option value=Option 2/option
option value=Option 3/option
.
.
.
option value=Option x/option
/select
I've got other html that generates a tabbed notebook. When I select
the appropriate page, the above is generated with the appropriate data
and loaded via Ajax into the notebook page. I've tried adding the
following to the notebook's .click function:
$(#jqmulti).multiSelect({
select_all_min: 3,
no_selection: No items selected,
selected_text: items selected
});
However, when I try it, nothing happens or it errors out (as seen in
firebug) with $(this).attr is not a function. In the case without the
error, the page for the notebook loads with the appropriate data, but
the multiSelect doesn't fire -- I see a scrollable multiselect box
instead. I've tried adding the jquery stuff to the html that gets
loaded via Ajax -- and when I do that firebug complains that #jqmulti
has no properties.
My guess is that the jquery is getting called too early. Is there any
way to delay it?
[jQuery] Re: sorting values with commas with tablesorter 2.0
I know a while back I was trying to sort percentages and they weren't working. That's because the percentages I had to sort were of the format xx.yy%. The parser for percent in tableSorter only handled them if they were of the format xx%. I ended up modifying the parser for percent to handle xx.yy% with as many y's as you wanted. So it now sorts 80%, 80.1%, 80.01% etc etc etc. In retrospect, I suppose I could have stripped out the '.' and then sorted it... *shrug*
[jQuery] Help with a basic module
I'm trying to get an understanding of jQuery modules, so I thought I'd
start simple (perhaps too simple...)
Anyway, here is what I have:
jQuery.table.js:
(function($) {
$.Table = {
build: function(settings) {
var table = $('table class=testTable/table');
var headRow = $('tr/tr').appendTo(table);
var rhcol_one = $('th' + settings.rhcol1 + '/
th').appendTo(headRow);
var rhcol_two = $('th' + settings.rhcol2 +'/
th').appendTo(headRow);
var row_one = $('tr/tr').appendTo(table);
var r1col_one = $('td' + settings.r1col1 + '/
td').appendTo(row_one);
var r1col_two = $('td' + settings.r1col2 + '/
td').appendTo(row_one);
return $(table);
}
};
})(jQuery);
function testthisout() {
$(body).append('p Whopee! /p');
$(body).append(jQuery.Table.build({
rhcol1: 'Header 1',
rhcol2: 'Header 2',
r1col1: 'Row 1 Col 1',
r1col2: 'Row 1 Col 2',
}));
}
I then have a simple html page built with a link whose onclick calls
testthisout.
Now maybe I'm misunderstanding things, but if I want to be able to
chain stuff onto my table module, I need to return a jQuery object
from it. I *think* that that is what I'm doing, as far as I can
understand things. Can anyone confirm this?
Also, is there a cleaner way to hide all the rhcol1...etc stuff? I
want to be able to pass information along that way, but when I append
the table I want to do it like: $
(body).append(jQuery.Table.build(my_table_info)).doSomethingElse(my_other_stuff)
(etc etc etc). Should I just build all that info into a var and
that's it?
I'm trying to avoid buildDOMxElement calls. Is there a better way
to do that than what I'm trying? jQuery just seems a lot nicer than
that.
I appologize if this seems noobie-ish. In truth I'm going to be
building more complex modules; I just want to get a firm grasp on this
at a simple level before I dive into that.
