Still stuck on this...would really appreciate someone's help.
Thanks, Pranshu. On Dec 27, 11:56 am, precar <pranshua...@gmail.com> wrote: > Hi, > > I cleaned up the code a bit and wanted to repost it. The site is > athttp://pranshuarya.com/test/pthesis/. Once again, the specific > problem is this: > When you click Portfolio > Refine by category and select a category, > it loads and works fine. But then you cannot re-click on Refine by > category to select another category. The link stops working after it's > been used once. > > // display category list in pop-up > $.get('categories.php',function(cats) { > $('#refine_by').toggle(function() { > $('#refine_by').text('Click to close'); > $('#categories').append('<div id="categories_lower_border"></ > div>').append('<div id="reset_sites">reset</div>').show('slow').append > ('<ul>'); > $(cats).find('categories').each(function() { > var $entry = $(this); > var $cat = $entry.find('category').text(); > var category = '<li>' + $cat + '</li>'; > $('#categories ul').append($(category)); > }); > $('#category_close').click(function() { > $('#categories').hide('slow'); > $('#refine_by').text('Refine by category'); > }); > $('#reset_sites').click(function() { > reset_sites(); > }); > > // selection from category list > $('#categories ul li').bind('click',function() { > var index = $('#categories ul li').index(this); > $.throbberShow({image:'images/ajax-loader.gif', parent:'#sites'}); > $.get(index + ".php",function(data) { > var $category = $(cats).find('category').eq(index).text(); > $('#sites').empty().append('<div id="sites_border"></div>').append > ('<div id="refine_by">Click to close</div>') > .append('<ul>'); > $(data).find('site').each(function() { > var $entry = $(this); > var $site_title = $entry.find('site_title').text(); > var html_site = '<li>' + $site_title + '</li>'; > $('#sites ul').append($(html_site)); > }); > cat_box_close(); > > // site details for category-filtered sites > $('#sites ul li').bind('click',function() { > var index = $('#sites ul li').index(this); > $('#site_details').empty().append('<div > id="site_details_lower_border"></div>'); > $('li:not(this)').removeClass('selected'); > $(this).addClass('selected'); > $imageURL = $(data).find('imageURL').eq(index).text(); > $skills = $(data).find('skills_used').eq(index).text(); > $siteURL = $(data).find('siteURL').eq(index).text(); > > var html_image = '<div><a href="' + $siteURL + '"><img src="' + > $imageURL + '" /></a></div>'; > $('#site_details').append($(html_image)); > $('#site_details div').addClass('screenshot'); > > if($(data).find('imageURL2').eq(index).text() != '') { > $imageURL2 = $(data).find('imageURL2').eq(index).text(); > var html_image2 = '<div>'; > if($(data).find('siteURL2').eq(index)) { > $siteURL2 = $(data).find('siteURL2').eq(index).text(); > html_image2 += '<a href="' + $siteURL2 +'"><img src="' + > $imageURL2 + '" /></a></div>'; > } > else > html_image2 += '<a href="' + $siteURL +'"><img src="' + > $imageURL2 + '" /></a></div>'; > $('#site_details').append($(html_image2)); > $('#site_details div').addClass('screenshot'); > } > else > $('#site_details div.screenshot').removeClass > ('screenshot').addClass('screenshot_single'); > > $('a...@href^=http]').attr({'target': '_blank'}).attr({'title': > 'Visit site'}); > > if($(data).find('description').eq(index)) { > $desc = $(data).find('description').eq(index).text(); > var html_desc = '<div id="description">' + $desc + '</div>'; > $('#site_details').append($(html_desc)); > } > if($(data).find('site_details').eq(index) != '') { > $details = $(data).find('site_details').eq(index).text(); > var html_details = '<div id="details"><br />' + $details + '</ > div>'; > $('#site_details').append($(html_details)); > } > > var html_skills = '<div id="skills"><strong>Skills used:</ > strong><br />' + $skills + '</div>'; > $('#site_details').append($(html_skills)); > }); > // end of site details for category-filtered sites > });}); > > // End of category list pop-up > > }, > > // other part of toggle function on #refine_by > function() { > cat_box_close(); > }); > }); > > Thanks, > Pranshu. > > On Dec 27, 7:29 am, donb <falconwatc...@comcast.net> wrote: > > > I didn't look too deeply into the code, but I suspect you are > > expecting appended elements to respond to click events, but those new > > elements will have no click event present, only the ones initially > > created by the ready function. > > > A working example link would be helpful. > > > On Dec 26, 1:13 pm, precar <pranshua...@gmail.com> wrote: > > > > Hi, > > > > Can someone please help me with the following navigation script I'm > > > trying to use on my page? I have a list of sites in the left div > > > which I would like to be able to filter out. The issue is that it > > > works only once. Once I filter once I can't reclick on the "Refine by > > > category" button and change categories or go back to showing all > > > categories. I'm guessing it's something to do with inner functions, > > > which I don't know enough about yet. Any help would be greatly > > > appreciated. > > > > The site is live athttp://pranshuarya.com/test/pthesis. > > > > The script: > > > > <script type="text/javascript"> > > > $(document).ready(function() { > > > $('#portfolio').hide(); > > > $('#pfolio_close').hide(); > > > $('#categories').hide(); > > > $('#pfolio').click(function() { > > > $.throbberShow({image:'images/ajax-loader.gif', > > > parent:'#sites'}); > > > $('#portfolio').show('slow'); > > > $('#pfolio_close').show('slow'); > > > $('#sites').empty(); > > > $('#site_details').empty(); > > > $('#sites').append('<div id="sites_border"></div>'); > > > $('#sites').append('<div id="refine_by">Refine by > > > category</div>'); > > > $('#site_details').append('<div > > > id="site_details_lower_border"></ > > > div>'); > > > > $('#sites').append('<ul>'); > > > $.get('data.php',function(data) { > > > $(data).find('site').each(function() { > > > var $entry = $(this); > > > var $site_title = > > > $entry.find('site_title').text(); > > > var html_site = '<li>' + $site_title + > > > '</li>'; > > > $('#sites ul').append($(html_site)); > > > }); > > > }); > > > > var showsites = function() { > > > $.get('data.php',function(data) { > > > $('#sites ul li').bind('click',function() { > > > var index = $('#sites ul li').index(this); > > > $('#site_details').empty(); > > > $('#site_details').append('<div > > > id="site_details_lower_border"></ > > > div>'); > > > $('li:not(this)').removeClass('selected'); > > > $(this).addClass('selected'); > > > $imageURL = > > > $(data).find('imageURL').eq(index).text(); > > > $skills = > > > $(data).find('skills_used').eq(index).text(); > > > $siteURL = > > > $(data).find('siteURL').eq(index).text(); > > > > var html_image = '<div><a href="' + > > > $siteURL + '"><img src="' + > > > $imageURL + '" /></a></div>'; > > > $('#site_details').append($(html_image)); > > > $('#site_details > > > div').addClass('screenshot'); > > > > > > > if($(data).find('imageURL2').eq(index).text() != '') { > > > $imageURL2 = > > > $(data).find('imageURL2').eq(index).text(); > > > var html_image2 = '<div>'; > > > > > > if($(data).find('siteURL2').eq(index)) { > > > $siteURL2 = > > > $(data).find('siteURL2').eq(index).text(); > > > html_image2 += '<a > > > href="' + $siteURL2 +'"><img src="' + > > > $imageURL2 + '" /></a></div>'; > > > } > > > else > > > html_image2 += '<a > > > href="' + $siteURL +'"><img src="' + > > > $imageURL2 + '" /></a></div>'; > > > > > > $('#site_details').append($(html_image2)); > > > $('#site_details > > > div').addClass('screenshot'); > > > } > > > else > > > $('#site_details > > > div.screenshot').removeClass > > > ('screenshot').addClass('screenshot_single'); > > > > $('a...@href^=http]').attr({'target': > > > '_blank'}).attr({'title': > > > 'Visit site'}); > > > > if($(data).find('description').eq(index)) > > > { > > ... > > read more »