click if else not working...? sometimes
Hello,
I am trying to build a tree menu that uses ajax. I have been able to get it working some of the time.
My problem is with the click function below. I originally used a toggle but since it is not bound to a
live event because this is has ajax generated content it would not work.
I am using a if else detecting if the object is hidden or not. It works some of the time but not all of the time?
I click and nothing happens. I looked in firebug at the console and there seem to be no errors?
Does anyone have any suggestions on how I can use the .toggle with .live or how I can redo my if else so
that it works every time?
Thanks!
-
$('.ahref',this).live("click", function(){
var id = $(this).attr('id');
var subid = $(this).attr('href');
if($('.sub'+subid).is(':hidden')) {
if($('.sub'+id).text() == '') {
//$("div.sub"+id).append("sub menus goes here");
var rand = '?random=' + Math.random();
$.getJSON('mclicks.php'+rand,{subid:subid,id:id},function(data){
$.each(data, function(i,item){
$.each(item, function(intIndex, objValue) {
// console.log(this);
$("div.sub"+subid).append("<a class='ahref' href='" + intIndex + "' onclick='return false;'>" + objValue + "</a> <div class='sub" + intIndex + " data'></div><br /> ");
});
});
});
$(".sub"+subid).addClass("data").slideDown(100);
} // end of blank text check...
} else {
$('.sub'+subid).slideUp(100);
$("div.sub"+subid).html("");
}
}, function () {
// $(this).html('Hide Clicks');
$('.sub'+subid).slideUp(100);
});
-
<a class="cat" href="17">Wedding & Special Event Services</a>
<br/>
<div class="box17 data" style="display: block;">
<a id="17" class="ahref" onclick="return false;" href="9">Bakeries</a>
<div class="sub9 data" style="display: block;">
</div>
<br/>
<a id="17" class="ahref" onclick="return false;" href="10">Bands & Musicians for Hire</a>
<div class="sub10 data" style="display: none;"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="11">Banquet Centers</a>
<div class="sub11 data"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="21">Catering</a>
<div class="sub21 data"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="46">DJs</a>
<div class="sub46 data"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="165">Event Rentals</a>
<div class="sub165 data"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="63">Florists</a>
<div class="sub63 data"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="170">Limousines</a>
<div class="sub170 data"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="123">Photographers</a>
<div class="sub123 data"/>
<br/>
<a id="17" class="ahref" onclick="return false;" href="150">Venues</a>
<div class="sub150 data"/>
<br/>
</div>