jQuery modal dialog inside SharePoint

opening a JQ modal in sharepoint comes with some troubles.

1st since JQ creates the modal OUTSIDE the body, initialy in order to let the modal hover over everything, it does it with some nice calculations. but with SP CSS's and HTML structure that doesn't work well, and sometimes you just don't see the modal, and sometimes you see it wierd.

in some cases the JQModal appendTo Property can do the job, but sometimes the best way is to give up jQuery's calculations and just fix the modal's position' and it can be done like that, using destroy since some calculations must be done again while position is not fixed:

$(function HP_ready() {
    $(".popup").on("click", function HPs_popupClick() {
        $(".salaryPopup", this).dialog({
            bgiframe: true,
            width: 965,
            modal: true,
            autoOpen: true,
            draggable: false,
            dialogClass: 'salaryPopupFrame',
            open: function () {
                $('.ui-dialog').css("position", "fixed");
            },
            close: function (event, ui) {
                $(this).dialog('destroy');
            }
        });
    });
});

Comments

Popular posts from this blog

c# Service Play Sound with NAudio example by Moshe

Asp.Net Ending Response options, Response.End() vs CompleteRequest()

JS/JQ simulate Enter event