change jQuery UI Dialog button as a simple link?

jquery, jquery-ui, jquery-ui-dialog

Solution

The default jQuery options doesn't support adding links.. however you can add anything you want to the wrapper.. See below,

$(function() {
    $("#myDlg").dialog({
        modal: true,
        buttons: {
            'Close': function() {
                $(this).dialog('close');
            }
        }
    })
    .parent()
    .find('.ui-dialog-buttonset')
    .prepend('<a href="javascript:void(0);" id="myCustomLink">My Custom Link</a>');

    $('#myCustomLink').click(function () {
        alert('my custom message');
    });
});

DEMO

Problem

I have a custom button defined in the jquery ui dialog box: ``` $("#myDlg").dialog({ modal: true, buttons: { 'My Custom Link': function () { alert('my custom message'); }, 'Close': function () { $(this).dialog('close'); } } }); ``` I would like to show the button 'My Custom Link' as an html link rather than with the default button style. How can I do that? thanks.

Original source

Related problems