bernardcandy
New Member
My goal is to show and hide a search form and a call number. When the search form is visible, the toggle should allow the form to submit. They shouldn't be open at the same time because there isn't room for both of them to be open, so I've written the functions to accept callback functions except both events seem to fire at the same time, ignoring the fact that they should wait for the first function to complete.What am I doing wrong? My code is pasted below, but here's a fiddle that demonstrates the problem. There may also be a better way to write this so I'm open to suggestions. Thanks.\[code\]//Functions for Search and Callvar closeSearch = function(callback) {$('.searchbox').removeClass('open').addClass('notOpen').animate({ width: '40px'}, function() { $('.call').animate({ width: '100%' }, function() { $('.call h4').fadeIn(); }); $('.search_bar').hide();});if (typeof callback == "function") { callback();}};var openSearch = function(callback) { $('.searchbox').animate({ width: '100%' }).addClass('open').removeClass('notOpen'); $('.search_bar').animate({ width: '100%' }).fadeIn(); $('.search_bar #searchform .search-query').animate({ width: '90%' }); if (typeof callback == "function") { callback(); }};var closeCall = function(callback) { $('.call').removeClass('open').addClass('notOpen') $('.call').animate({ width: '60px' }); $('.call h4').fadeOut(); if (typeof callback == "function") { callback(); }};var openCall = function(callback) { $('.call').animate({ width: '100%' }, function() { $('.call h4').fadeIn(); }); $('.searchbox').addClass('notOpen'); if (typeof callback == "function") { callback(); }};// Search Box Toggle$('.searchbox a').toggle(function() { if ($('.searchbox').hasClass('notOpen')) { closeCall(function() { openSearch(); }); } else { $('.search_bar #searchform').submit(); }}, function() { if ($('.searchbox').hasClass('notOpen')) { closeCall(function() { openSearch(); }); } else { $('.search_bar #searchform').submit(); }});//Call Box Toggle$('.call a').toggle(function() { if ($('.searchbox').hasClass('open')) { closeSearch(function() { openCall(); }); } else { openCall(); }}, function() { if ($('.searchbox').hasClass('open')) { closeSearch(function() { openCall(); }); } else { closeCall(); }});?\[/code\]