[jQuery] [Autocomplete] - Doesn't always work
Greetings, I'm currently using this awesome plugin for my web app but I'm having a bit of an annoying bug with it. It sometimes does not pull up any results when typing in. Like if I have something in the database with the name March and I type in mar it shows the little loading.gif but then disappears and doesn't give me any results. If I tab away and come back to it and try it again, then it will work. And even that doesn't make it work. Sometimes I have to totally refresh the page. I thought it might be the cache mechanism so I turned that off setting cacheLength to 1. Any other ideas as to why it sometimes works and sometimes doesn't?
[jQuery] Re: [Autocomplete] - Doesn't always work
Shawn, yes, that is the plugin I am talking about. In Jorn's blog
post on Autocomplete he said to post here with [Autocomplete] in the
subject if having problems.
Here's the code I'm using:
$(#client_name).autocomplete(/ac/get_clients/, {
scroll: true,
scrollHeight: 300,
autoFill: true,
cacheLength: 1,
max: 20,
matchContains: false
});
I also have a .result(function(){}); running after that as well so I
can populate a form with the returned data from the autocomplete.
I'm using CodeIgniter as my php framework utilizing a library called
DataMapper which is an implementation of an ORM. Here's the function
I'm using to return the data:
function get_clients()
{
$c = new Client();
$c-get();
$q = strtolower($_POST['q']);
if ( ! $q)
return;
foreach ($c-all as $client) {
if (strpos(strtolower($client-name), $q) !== false) {
echo $client-name|$client-id\n;
}
}
}
On May 19, 5:36 pm, Shawn sgro...@open2space.com wrote:
There are a few different autocomplete plugins out there. I'll assume
you are using the one found
athttp://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ (which
is the one documented at docs.jquery.com) The author, Jorn Zaefferer,
is on this list often
I've seen oddities like this with the plugin, but it pretty much always
was a problem in how I was implementing the plugin. Or a potential
problem with my server side code or local network. But I tend to do
more than the absolute basics too, so I always assume it's my fault
first.. :)
Short of seeing some sample code, I'm not sure how much more I can help
out... But hope that points you towards the solution somewhat.
Shawn
MeanStudios wrote:
Greetings,
I'm currently using this awesome plugin for my web app but I'm having
a bit of an annoying bug with it. It sometimes does not pull up any
results when typing in. Like if I have something in the database with
the name March and I type in mar it shows the little loading.gif
but then disappears and doesn't give me any results. If I tab away
and come back to it and try it again, then it will work. And even
that doesn't make it work. Sometimes I have to totally refresh the
page. I thought it might be the cache mechanism so I turned that off
setting cacheLength to 1.
Any other ideas as to why it sometimes works and sometimes doesn't?
[jQuery] Re: [Autocomplete] - Doesn't always work
Thank you very much for your reply! Lots of great ideas :).
I will let you know how it all turns out.
As for using the database to do the filtering, that is a great idea!
Yes, I have full control over the client class so it shouldn't be a
problem.
Best Regards!
On May 20, 7:45 am, Shawn sgro...@open2space.com wrote:
I don't see anything tooo odd here. Here's what I would suggest though:
1. Call the autocomplete function a few times manually. Put the URL to
it in the browser's address bar and load the page a few times (you'll
need to switch your code to use $_GET though). Try to mix up the speed
of reloads, the data being passed, etc. IF you see any blank pages,
then you know the server side code is where the problem is at. But if
you always see output, continue debugging
2. Temporarily remove the .result() method just to ensure that is not
causing confusion somewhere. Commenting it out should be good enough.
3. Make sure you are using the most recent stable version of the plugin.
4. In your PHP code, where you are checking for no 'q' value and just
exit the function replace that return with something like
echo no criteria|0;
return;
Just to see if this condition is the problem area. Also, I'd probably
change the condition to be if (empty($q)) - which is a slightly
better check. That's a style thing though, so up to you
Now, with that out of the way... Your PHP code seems odd to me. Why
pull back ALL clients and then do a string comparison to sort out what
to show or not? It is MUCH faster/more efficient to let the database do
that filtering for you. Do you have control of the Client class? If
so, can you add a search method that takes the 'q' value as a criteria
for the name? But, the code as is *should* run, so take my comments as
constructive observations... :)
Shawn
MeanStudios wrote:
Shawn, yes, that is the plugin I am talking about. In Jorn's blog
post on Autocomplete he said to post here with [Autocomplete] in the
subject if having problems.
Here's the code I'm using:
$(#client_name).autocomplete(/ac/get_clients/, {
scroll: true,
scrollHeight: 300,
autoFill: true,
cacheLength: 1,
max: 20,
matchContains: false
});
I also have a .result(function(){}); running after that as well so I
can populate a form with the returned data from the autocomplete.
I'm using CodeIgniter as my php framework utilizing a library called
DataMapper which is an implementation of an ORM. Here's the function
I'm using to return the data:
function get_clients()
{
$c = new Client();
$c-get();
$q = strtolower($_POST['q']);
if ( ! $q)
return;
foreach ($c-all as $client) {
if (strpos(strtolower($client-name), $q) !== false) {
echo $client-name|$client-id\n;
}
}
}
On May 19, 5:36 pm, Shawn sgro...@open2space.com wrote:
There are a few different autocomplete plugins out there. I'll assume
you are using the one found
athttp://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/(which
is the one documented at docs.jquery.com) The author, Jorn Zaefferer,
is on this list often
I've seen oddities like this with the plugin, but it pretty much always
was a problem in how I was implementing the plugin. Or a potential
problem with my server side code or local network. But I tend to do
more than the absolute basics too, so I always assume it's my fault
first.. :)
Short of seeing some sample code, I'm not sure how much more I can help
out... But hope that points you towards the solution somewhat.
Shawn
MeanStudios wrote:
Greetings,
I'm currently using this awesome plugin for my web app but I'm having
a bit of an annoying bug with it. It sometimes does not pull up any
results when typing in. Like if I have something in the database with
the name March and I type in mar it shows the little loading.gif
but then disappears and doesn't give me any results. If I tab away
and come back to it and try it again, then it will work. And even
that doesn't make it work. Sometimes I have to totally refresh the
page. I thought it might be the cache mechanism so I turned that off
setting cacheLength to 1.
Any other ideas as to why it sometimes works and sometimes doesn't?
[jQuery] Re: - Doesn't always work
Shawn,
I have fixed my problem! It now works 100% of the time.
1) Tested it and it worked every time so no problems there
2) Removed it and there was no change, still had the problem
3) Check
4) Made those changes and also used the empty() function and no
change, still had the problem
Extra Stuff: I changed my php function to the following:
function get_clients()
{
$c = new Client();
$q = strtolower($_POST['q']);
if (empty($q))
return;
$c-like('name', $q)-get();
foreach ($c-all as $client)
{
echo $client-name|$client-id\n;
}
}
It still didn't work but I found that it was a lot more efficient,
which is always better!
The thing I found that made it so it wouldn't work until I tabbed off
and then tabbed back on again was calling the following line of jQuery
code before I initialized the autocomplete:
$('#client_name').focus();
I put that at the end of my codeblock and just like magic, everything
worked smoothly :). So let that be a lesson to myself heh.
Thanks again for all your suggestions and your help on this! I
wouldn't have figured that out as fast as I did without the suggestion
of returning Nothing|0 because the autocomplete didn't even return
that heh. Made me realize that it was something else in my code other
than the php and autocomplete script. Anways, have a great day!
Best Regards,
cody
On May 20, 7:52 am, MeanStudios cody.lundqu...@gmail.com wrote:
Thank you very much for your reply! Lots of great ideas :).
I will let you know how it all turns out.
As for using the database to do the filtering, that is a great idea!
Yes, I have full control over the client class so it shouldn't be a
problem.
Best Regards!
On May 20, 7:45 am, Shawn sgro...@open2space.com wrote:
I don't see anything tooo odd here. Here's what I would suggest though:
1. Call the autocomplete function a few times manually. Put the URL to
it in the browser's address bar and load the page a few times (you'll
need to switch your code to use $_GET though). Try to mix up the speed
of reloads, the data being passed, etc. IF you see any blank pages,
then you know the server side code is where the problem is at. But if
you always see output, continue debugging
2. Temporarily remove the .result() method just to ensure that is not
causing confusion somewhere. Commenting it out should be good enough.
3. Make sure you are using the most recent stable version of the plugin.
4. In your PHP code, where you are checking for no 'q' value and just
exit the function replace that return with something like
echo no criteria|0;
return;
Just to see if this condition is the problem area. Also, I'd probably
change the condition to be if (empty($q)) - which is a slightly
better check. That's a style thing though, so up to you
Now, with that out of the way... Your PHP code seems odd to me. Why
pull back ALL clients and then do a string comparison to sort out what
to show or not? It is MUCH faster/more efficient to let the database do
that filtering for you. Do you have control of the Client class? If
so, can you add a search method that takes the 'q' value as a criteria
for the name? But, the code as is *should* run, so take my comments as
constructive observations... :)
Shawn
MeanStudios wrote:
Shawn, yes, that is the plugin I am talking about. In Jorn's blog
post on Autocomplete he said to post here with [Autocomplete] in the
subject if having problems.
Here's the code I'm using:
$(#client_name).autocomplete(/ac/get_clients/, {
scroll: true,
scrollHeight: 300,
autoFill: true,
cacheLength: 1,
max: 20,
matchContains: false
});
I also have a .result(function(){}); running after that as well so I
can populate a form with the returned data from the autocomplete.
I'm using CodeIgniter as my php framework utilizing a library called
DataMapper which is an implementation of an ORM. Here's the function
I'm using to return the data:
function get_clients()
{
$c = new Client();
$c-get();
$q = strtolower($_POST['q']);
if ( ! $q)
return;
foreach ($c-all as $client) {
if (strpos(strtolower($client-name), $q) !== false) {
echo $client-name|$client-id\n;
}
}
}
On May 19, 5:36 pm, Shawn sgro...@open2space.com wrote:
There are a few different autocomplete plugins out there. I'll assume
you are using the one found
athttp://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/(which
is the one documented at docs.jquery.com) The author, Jorn Zaefferer,
is on this list often
I've seen oddities like this with the plugin, but it pretty much always
was a problem in how I was implementing the plugin. Or a potential
problem with my server side code
[jQuery] jQuery Form Plugin Problem: IE7 gives Object doesn't support property or method
Greetings,
I'm using jQuery 1.3.2 and jQuery Form Plugin 2.25.
My code:
$('#msre_file').change(function(){
el = $(this);
target = el.next();
$('#entryform').ajaxSubmit({
url: '?php echo $cp_url; ?ms_rel_file=upload',
type: 'post',
iframe: true,
success: function(response) {
el.attr('value', '');
target.append('div class=msre_tmp_upload
style=display:none;'+response+'/div');
target.children('.msre_tmp_upload').fadeIn();
}
});
return false;
});
The form tag looks like:
form action=index.php?C=editamp;M=new_entry name=entryform
id=entryform method=post
It works in FF2/3, Safari, IE8 but not in IE7. I get an error on line
257 which is:
form.submit();
I've changed that line to document.entryform.submit(); just for kicks
and it still throws the error message.
I've also done window.document.getElementById('entryform').submit();
and it still doesn't work.
I've done alert(document.entryform.msre_file.value); and it gives me
the value of the file input correctly so I know it's referencing the
form correctly.
Yes I've changed the name attribute of the submit button to something
other than submit.
I've also scrapped the jQuery Form Plugin and wrote my own form submit
function using the iframe method and it too worked in FF, Safari and
IE8 but still threw the same error in IE7.
I'm getting rather frustrated with this :(.
Any help would be hugely appreciated.
[jQuery] Re: jQuery Form Plugin Problem: IE7 gives Object doesn't support property or method
Update:
I am using ExpressionEngine and am trying to edit to the publish area
(for those of you wondering) and I have no control over the name
attribute for the submit button and it's value is submit so I've
used jQuery to change the name of the submit button to something else
with this line of code:
$(input[name='submit']).attr('name', 'change_submit');
This works for FF, Safari and IE8 but it seems IE7 doesn't pick up
that change and still things the button is named submit. I've used
the developer tool in the IE8 browser to check the DOM when it's
rendering in IE7 and it shows as 'change_submit' there so I'm not sure
what's up.
I've hacked the cp.publish.php file to manually change the submit
buttons name to something else and everything is working now. So, the
problem is IE7 doesn't accept the button name change using jQuery.
Maybe if I remove that button and rebuild it?
On Apr 14, 8:23 am, MeanStudios cody.lundqu...@gmail.com wrote:
Greetings,
I'm using jQuery 1.3.2 and jQuery Form Plugin 2.25.
My code:
$('#msre_file').change(function(){
el = $(this);
target = el.next();
$('#entryform').ajaxSubmit({
url: '?php echo $cp_url; ?ms_rel_file=upload',
type: 'post',
iframe: true,
success: function(response) {
el.attr('value', '');
target.append('div class=msre_tmp_upload
style=display:none;'+response+'/div');
target.children('.msre_tmp_upload').fadeIn();
}
});
return false;
});
The form tag looks like:
form action=index.php?C=editamp;M=new_entry name=entryform
id=entryform method=post
It works in FF2/3, Safari, IE8 but not in IE7. I get an error on line
257 which is:
form.submit();
I've changed that line to document.entryform.submit(); just for kicks
and it still throws the error message.
I've also done window.document.getElementById('entryform').submit();
and it still doesn't work.
I've done alert(document.entryform.msre_file.value); and it gives me
the value of the file input correctly so I know it's referencing the
form correctly.
Yes I've changed the name attribute of the submit button to something
other than submit.
I've also scrapped the jQuery Form Plugin and wrote my own form submit
function using the iframe method and it too worked in FF, Safari and
IE8 but still threw the same error in IE7.
I'm getting rather frustrated with this :(.
Any help would be hugely appreciated.
[jQuery] Re: jQuery Form Plugin Problem: IE7 gives Object doesn't support property or method
Second Update:
If you remove the name attribute from the button using jQuery then it
works. Just changing the name does not.
All fixed.
On Apr 14, 11:01 am, MeanStudios cody.lundqu...@gmail.com wrote:
Update:
I am using ExpressionEngine and am trying to edit to the publish area
(for those of you wondering) and I have no control over the name
attribute for the submit button and it's value is submit so I've
used jQuery to change the name of the submit button to something else
with this line of code:
$(input[name='submit']).attr('name', 'change_submit');
This works for FF, Safari and IE8 but it seems IE7 doesn't pick up
that change and still things the button is named submit. I've used
the developer tool in the IE8 browser to check the DOM when it's
rendering in IE7 and it shows as 'change_submit' there so I'm not sure
what's up.
I've hacked the cp.publish.php file to manually change the submit
buttons name to something else and everything is working now. So, the
problem is IE7 doesn't accept the button name change using jQuery.
Maybe if I remove that button and rebuild it?
On Apr 14, 8:23 am, MeanStudios cody.lundqu...@gmail.com wrote:
Greetings,
I'm using jQuery 1.3.2 and jQuery Form Plugin 2.25.
My code:
$('#msre_file').change(function(){
el = $(this);
target = el.next();
$('#entryform').ajaxSubmit({
url: '?php echo $cp_url; ?ms_rel_file=upload',
type: 'post',
iframe: true,
success: function(response) {
el.attr('value', '');
target.append('div class=msre_tmp_upload
style=display:none;'+response+'/div');
target.children('.msre_tmp_upload').fadeIn();
}
});
return false;
});
The form tag looks like:
form action=index.php?C=editamp;M=new_entry name=entryform
id=entryform method=post
It works in FF2/3, Safari, IE8 but not in IE7. I get an error on line
257 which is:
form.submit();
I've changed that line to document.entryform.submit(); just for kicks
and it still throws the error message.
I've also done window.document.getElementById('entryform').submit();
and it still doesn't work.
I've done alert(document.entryform.msre_file.value); and it gives me
the value of the file input correctly so I know it's referencing the
form correctly.
Yes I've changed the name attribute of the submit button to something
other than submit.
I've also scrapped the jQuery Form Plugin and wrote my own form submit
function using the iframe method and it too worked in FF, Safari and
IE8 but still threw the same error in IE7.
I'm getting rather frustrated with this :(.
Any help would be hugely appreciated.
[jQuery] Best Practices, Am I Using Them?
Greetings,
I'm writing an accordion effect of some sorts into a new web site I am
developing which utilizes load() to bring in the outside information
into the div that's dropping down when I click a particular link.
I've had to use livequery as well since there is javascript (using the
UI Tabs Plug-in) inside the div that's getting populated by load().
I'm rather new to jQuery and I am wondering if there is a better way
to write the following code. I am using a lot of Traversing methods,
(i.e. next(), prev(), children(), etc..) and it just seems like I'm
not doing a very good job. My code is doing what I wrote it for
though and it seems to be working very well.
Another concern I have is how do I get everything to stop if I click
the the show more ('.villa_right_more_info') link twice quickly so
it rolls the div back up? It does roll the div back up now but after
a second it rolls back down and shows a blank box.
If someone could just give me some good pointers so I can put them
into practice, that would be great :). Also, if someone wants to see
my script live, shoot me an email and I will give you the link.
$(document).ready(function() {
$('.villa_right_more_info').livequery(function(){
$(this).click(function() {
if ($(this).hasClass(selected))
{
target = $(this).attr(target);
$(this).removeClass(selected);
$(target).parent().animate({'opacity' : '0'},
500, function(){
$(target).parent().animate({'height' :
0}, 500, function(){
$(target).parent().prev().prev().prev().css({'border-bottom' :
'0'});
$(target).parent().removeClass(open);
});
});
} else {
$this = $(.villa_wrapper).find(.open);
$this.animate({'opacity' : '0'}, 500,
function(){
$this.animate({'height' : 0}, 500,
function(){
$this.prev().prev().prev().css({'border-bottom' : '0'});
$this.removeClass(open);
$this.prev().prev().children
(.villa_right_more_info).removeClass(selected);
});
});
myLink = $(this).attr(href);
target = $(this).attr(target);
$(this).addClass(selected);
$(this).parent().prev().animate({'opacity' :
'1'}, 10, function(){
$(this).css({'border-bottom' : '1px
solid #617D93'});
});
$(target).css({'position' : 'relative'});
$(target).parent().addClass(open);
$(target).fadeOut(10, function(){
$(target).parent().animate({height:
258px, opacity: 1}, 500,
function(){
$(target).prev(.loading).fadeIn(500, function(){
$(target).load(myLink,
function(){
$(target).children(.villa_tabs).tabs({
show:
function(event, ui)
{
$(target).prev(.loading).fadeOut(500, function(){
var tabPanel = $(#+ui.panel.id);
$(target).fadeIn(500);
$(target).parent().css({'overflow' : 'hidden'}).animate
({height : $(tabPanel).outerHeight(true) + $(target).children
(.villa_photo_carousel).outerHeight(true) + 28}, function(){
});
});
},
fx:
{'opacity' : 'toggle'}
});
});
});
[jQuery] Re: Best Practices, Am I Using Them?
Also, for some reason when I try to use jQuery 1.3.1 to run this it hangs around where I'm trying to init the tabs. I took that part out and it loaded the div fine, so it's not load(). Is UI Tabs not compatible with jQuery 1.3.1? Guess I could try to use jQuery 1.3.2 to see if it works. I'd like to use jQuery 1.3 so I can replace the livequery plugin with using the new built in function live().
[jQuery] Re: Best Practices, Am I Using Them?
Okay, I was using 1.5.3 and after reading your post I downloaded the 1.6RC6 for jQuery 1.3 and tried that. It doesn't hang anymore (using jQuery 1.3.2) but the livequery plugin doesn't seem to be working because the tabs I am trying to initialize isn't working after load() pulls in the data. On Feb 26, 8:42 am, Eric Garside gars...@gmail.com wrote: What version of jQuery UI are your using? On Feb 25, 4:39 pm, MeanStudios cody.lundqu...@gmail.com wrote: Also, for some reason when I try to use jQuery 1.3.1 to run this it hangs around where I'm trying to init the tabs. I took that part out and it loaded the div fine, so it's not load(). Is UI Tabs not compatible with jQuery 1.3.1? Guess I could try to use jQuery 1.3.2 to see if it works. I'd like to use jQuery 1.3 so I can replace the livequery plugin with using the new built in function live().
[jQuery] Re: Best Practices, Am I Using Them?
Thank you very much! Sending the email now :). On Feb 26, 8:57 am, Eric Garside gars...@gmail.com wrote: Sorry missed your second post. Shoot me an email and I'll take a look at it tonight, and see if I can help you clean it up some and keep it functional. :) On Feb 25, 4:52 pm, MeanStudios cody.lundqu...@gmail.com wrote: Okay, I was using 1.5.3 and after reading your post I downloaded the 1.6RC6 for jQuery 1.3 and tried that. It doesn't hang anymore (using jQuery 1.3.2) but the livequery plugin doesn't seem to be working because the tabs I am trying to initialize isn't working after load() pulls in the data. On Feb 26, 8:42 am, Eric Garside gars...@gmail.com wrote: What version of jQuery UI are your using? On Feb 25, 4:39 pm, MeanStudios cody.lundqu...@gmail.com wrote: Also, for some reason when I try to use jQuery 1.3.1 to run this it hangs around where I'm trying to init the tabs. I took that part out and it loaded the div fine, so it's not load(). Is UI Tabs not compatible with jQuery 1.3.1? Guess I could try to use jQuery 1.3.2 to see if it works. I'd like to use jQuery 1.3 so I can replace the livequery plugin with using the new built in function live().
[jQuery] Re: Best Practices, Am I Using Them?
Awesome, thank you very much for the pointers :D. I will fix that
right now.
\o/ for learning something new :D.
On Feb 26, 3:21 pm, Matt Kruse m...@thekrusefamily.com wrote:
On Feb 25, 3:23 pm, MeanStudios cody.lundqu...@gmail.com wrote:
If someone could just give me some good pointers so I can put them
into practice, that would be great :).
I'm just going to point out one thing that I also try to hammer into
the heads of new jQuery developers I work with - cache references to
jQuery objects in temporary variables!
target = $(this).attr(target);
$(this).removeClass(selected);
$(target).parent().animate({'opacity' : '0'}, 500, function(){
$(target).parent().animate({'height' : 0}, 500, function(){
$(target).parent().prev().prev().prev().css({'border-bottom' : '0'});
$(target).parent().removeClass(open);
In this example, you could do:
var $this = $(this);
var $target_parent = $($this.attr(target)).parent();
$this.removeClass(selected);
$target_parent.animate({'opacity' : '0'}, 500, function(){
$target_parent.animate({'height' : 0}, 500, function(){
$target_parent.prev().prev().prev().css({'border-bottom' : '0'});
$target_parent.removeClass(open);
Similarly,
$(target).css({'position' : 'relative'});
$(target).parent().addClass(open);
$(target).fadeOut(10, function(){
should be:
var $target = $(target);
$target.css({'position' : 'relative'});
$target.parent().addClass(open);
$target.fadeOut(10, function(){
Every time you do $() you are calling a function and creating a new
object, which actually has some overhead. Only jQuery-ize an object
once, and then refer back to that jQuery object repeatedly.
Matt Kruse
[jQuery] Re: Best Practices, Am I Using Them?
I've revised my code and added some features as well to catch some
errors. I'm still having problems with clicking on the link twice
quickly and it rolling back down an empty box. I think the problem is
with the load() function, it doesn't stop and when it finishes it
rolls the div back down again. So I'm guessing if I find a way to
cancel the load() function, this will fix my problem.
$(document).ready(function() {
$('.tabs').livequery(function(){
var $this = $(this);
var $target = $($this.attr(target));
$this.click(function() {
if ($this.siblings().hasClass(selected))
{
$this.siblings().removeClass(selected);
$this.addClass(selected);
$target.children(.villa_tabs).tabs('option',
'selected',
$this.attr(rel) == inquire ? 1 : 0);
} else {
if ($this.hasClass(selected))
{
$this.removeClass(selected);
$target.parent().animate({'opacity' :
'0'}, 500, function(){
$target.parent().animate({'height' : 0}, 500, function(){
$target.parent().prev().prev().prev().css({'border-bottom' :
'0'});
$target.parent().removeClass(open);
});
});
} else {
var $open_wrapper =
$(.villa_wrapper).find(.open);
$open_wrapper.animate({'opacity' :
'0'}, 500, function(){
$open_wrapper.animate({'height'
: 0}, 500, function(){
$open_wrapper.prev().prev().prev().css({'border-bottom' :
'0'});
$open_wrapper.removeClass(open);
$open_wrapper.prev().prev().children
(.villa_right_more_info).removeClass(selected);
$open_wrapper.prev().prev().children
(.villa_right_more_info).siblings().removeClass(selected);
});
});
var myLink = $this.attr(href);
$this.addClass(selected);
$this.parent().prev().animate({'opacity' : '1'}, 10, function(){
$this.parent().prev().css({'border-bottom' : '1px solid
#617D93'});
});
$target.css({'position' : 'relative'});
$target.parent().addClass(open);
$target.fadeOut(10, function(){
$target.parent().animate({height: 258px, opacity: 1}, 500,
function(){
$target.prev(.loading).fadeIn(500, function(){
$target.load(myLink, function(){
$target.children(.villa_tabs).tabs({
show: function(event, ui)
{
$target.prev(.loading).fadeOut(500, function(){
var $tabPanel = $(#+ui.panel.id);
$target.fadeIn(500);
$target.parent().css({'overflow' : 'hidden'}).animate
({height : $tabPanel.outerHeight(true) + $target.children
(.villa_photo_carousel).outerHeight(true) + 28}, function(){
});
});
},
fx: {'opacity' : 'toggle'},
selected: $this.attr(rel) == inquire ? 1 : 0
[jQuery] Re: Best Practices, Am I Using Them?
I've fixed my problem.
Right when I click the button I have jQuery add a class called
selected to it which tells jQuery where the click came from since I
have two buttons that can trigger this code. If the other button is
clicked while the first one still has selected in it's class list
then it triggers a different part of the code to just change tabs
instead of reload the whole div again. This also removes the class
selected from the original button and adds it to the second button
clicked. Then if you click that second button again it removes the
class selected and it rolls up the div. So I thought to put a
conditional just inside the callback function of the load() function
which checks to see if that selected class is still there. If it
isn't, the code doesn't run. If it is, well you get the picture. So
now I've got this pretty locked up to where a user can't break my
code :).
I have a sneaky suspicion that my code is no-where near as optimized
as it could be though. Which brings me back to my original question.
How can I make the code below better?
Revised code below:
$(document).ready(function() {
$('.tabs').livequery(function(){
var $this = $(this);
var $target = $($this.attr(target));
$this.click(function() {
if ($this.siblings().hasClass(selected))
{
$this.siblings().removeClass(selected);
$this.addClass(selected);
$target.children(.villa_tabs).tabs('option',
'selected',
$this.attr(rel) == inquire ? 1 : 0);
} else {
if ($this.hasClass(selected))
{
$this.removeClass(selected);
$target.parent().animate({'opacity' :
'0'}, 500, function(){
$target.parent().animate({'height' : 0}, 500, function(){
$target.parent().prev().prev().prev().css({'border-bottom' :
'0'});
$target.parent().removeClass(open);
});
});
} else {
var $open_wrapper =
$(.villa_wrapper).find(.open);
$open_wrapper.animate({'opacity' :
'0'}, 500, function(){
$open_wrapper.animate({'height'
: 0}, 500, function(){
$open_wrapper.prev().prev().prev().css({'border-bottom' :
'0'});
$open_wrapper.removeClass(open);
$open_wrapper.prev().prev().children(.tabs).removeClass
(selected);
});
});
var myLink = $this.attr(href);
$this.addClass(selected);
$this.parent().prev().animate({'opacity' : '1'}, 10, function(){
$this.parent().prev().css({'border-bottom' : '1px solid
#617D93'});
});
$target.css({'position' : 'relative'});
$target.parent().addClass(open);
$target.fadeOut(10, function(){
$target.parent().animate({height: 258px, opacity: 1}, 500,
function(){
$target.prev(.loading).fadeIn(500, function(){
$target.load(myLink, function(){
if
($this.hasClass(selected))
{
$target.children(.villa_tabs).tabs({
show: function(event, ui)
{
$target.prev(.loading).fadeOut(500, function(){
var $tabPanel = $(#+ui.panel.id);
$target.fadeIn(500);
[jQuery] Re: unsubscribe
Is there a reason why you changed the subject to unsubscribe? On Nov 17, 10:14 pm, Andrew Taylor [EMAIL PROTECTED] wrote: MeanStudios wrote: Greetings, I am using this plugin in my web application and I had a quick question. Is there a way to trigger an ajax call if someone selects something from the dropdown list? The ajax call would then fill in some fields below related to what was just selected from the autocomplete field. Thank you for your time, cody
[jQuery] Question about [Autocomplete]
Greetings, I am using this plugin in my web application and I had a quick question. Is there a way to trigger an ajax call if someone selects something from the dropdown list? The ajax call would then fill in some fields below related to what was just selected from the autocomplete field. Thank you for your time, cody
