Search code examples
jqueryajaxcolorbox

jQuery Colorbox: Trouble loading single ID through ajax (not the full page)


I'm trying to load a form named #submit-text-form through jQuery colorbox. However, colorbox ends up loading the entire page that the original link is targeting. I followed the instructions here but it is still loading the full page. Any ideas on what I could be doing wrong?

$(function(){
$('#submit-link').colorbox({
opacity: 0.3,
transition: 'fade',
href: $("#submit-link").attr('href') + "#submit-text-form",
});
});

Solution

  • Try this:

    $(function(){
    $('#submit-link').colorbox({
    opacity: 0.3,
    transition: 'fade',
    href: $("#submit-link").attr('href') + " #submit-text-form",
    });
    })
    

    There needs to be a space before the your selector " #submit-text-form. Colorbox uses jQuery's load() method for ajax handling, so it works the same way.