Colorbox: Calling colorbox.close

Adam picture Adam · Mar 25, 2011 · Viewed 24.5k times · Source

I'm working on a project that uses the velocity templating system, so the $ character is reserved, and cannot be used in javascript variable names.

As such, I have to prefix jQuery variables and methods with jQuery, rather than $, e.g. jQuery(document).ready(function() {}); as opposed to $(document)ready(function(){});

This is ordinarily fine, but in this case I am using colorbox.

My code to call colorbox works fine, and looks like this:

jQuery(document).ready(function () {
    jQuery("#addUser").colorbox({
        href:"add",
        width:"500px",
        onClosed: function (message) {
            dataTable.refresh(jQuery("#ajaxResult").text(message));
        }
    })

    ...
})

I have a link inside the colorbox that I want to attach the colorbox.close method to, but when I click the link, I get this error:

Uncaught TypeError: Cannot call method 'close' of undefined

This is my code:

jQuery(document).ready(function () {
    jQuery("a").click(function() {
        jQuery.colorbox.close("User added succesfully");
    });

    ...
})

Can anybody tell me why I cannot close the colorbox?

By the way, the X that comes with colorbox still works to close it.

Answer

Chris Shouts picture Chris Shouts · Mar 25, 2011
jQuery("#addUser").colorbox.close("User added succesfully");

Also, you should be able to use the $ syntax for jQuery if you choose by using external javascript files <script type="text/javascript" src="my_script_file.js" /> or escaping the $ like \$.