Using the latest jQuery (1.9.0), I am confused why this code does not work:
$.testAjaxFilter = function() {
var base = this;
var currentFaqCategories = $('#category-list ul li a');
if ( typeof currentFaqCategories !== 'undefined') {
$.each(currentFaqCategories, function(index, category) {
$(category).click( function(e) {
$(e.target).getFaqList();
return false;
});
});
}
$.fn.getFaqList = function() {
$.get($(this[0]).attr('href'), function(data) {
base.addFaqSectionToPage( $(data).find('section.faq-page #content-column') );
});
};
this.addFaqSectionToPage = function(faqSection) {
var currentFaqSection = $('section.faq-page #content-column');
currentFaqSection.empty();
currentFaqSection.append(faqSection);
};
};
$.testAjaxFilter();
When viewing the console by clicking on one of the category links, GET retrieves the entire page in its response, but it is followed by a syntax error, an unrecognized expression: (lists all the HTML from the extracted page). So, in $.fn.getFaqListsomething wrong, maybe use $(data)?
Is there something obvious I'm doing wrong? Any help would be greatly appreciated. I am not very good at AJAX stuff.
source
share