2009-10-16 6 views
0

J'utilise le plugin jQuery BlockUI (v2) parce qu'il fait basculer la casbah.ASP.NET Ajax - Utilisation de jQuery BlockUI à deux endroits; puis-je débloquer un div spécifique?

Pour chaque requête ASP.NET AJAX faite sur la page, j'utilise les événements côté client InitializeRequest et EndRequest pour bloquer et débloquer l'interface, respectivement - cela me permet de facilement lancer un "Veuillez patienter ... "dialogue" Le code est le suivant:

var prm = Sys.WebForms.PageRequestManager.getInstance(); 
prm.add_endRequest(EndRequest); 
prm.add_initializeRequest(InitializeRequest); 
var blockTimer; 
var blockTimerFired; 

function InitializeRequest(sender, args) { 
    blockTimer = setTimeout(blockPage, 100); 
    blockTimerFired = false; 
} 

function EndRequest(sender, args) { 
    unblockPage(); 
} 

function unblockPage() { 
    // Check if the timer has run yet, and if it hasn't, cancel it 
    if (blockTimerFired) { 
     document.body.style.cursor = "default"; 
     $.unblockUI(); 
    } 
    else { 
     clearTimeout(blockTimer); 
    } 
} 

function blockPage() { 
    document.body.style.cursor = "wait"; 
    var loadingMessage = '<div style="padding-top:30px;min-height:75px;font-weight:bold;font-size:12pt;"><img align="absmiddle" src="../Images/ajax-loader.gif" /> Please wait...</div>'; 
    $.blockUI({ centerX: true, centerY: true, css: { backgroundColor: '#ebebeb', color: '#000' }, message: loadingMessage }); 
    blockTimerFired = true; 
} 

Le comportement ci-dessus fonctionne correctement. Cependant, dans certains cas, j'utilise aussi blockUI (sur la même page) pour créer un dialogue modal oui/non. Cette boîte de dialogue est chargée lorsque le document est prêt.

Le problème est que mon $ .unblockUI() appel à unblockPage() semble tuer les deux boîtes de dialogue. Est-il possible de cibler facilement une div spécifique avec $ .unblockUI()? Ce serait génial si je pouvais appeler $ .unblockUI ("# myYesNoDiv"), par exemple.

Répondre

4

J'étais trop compliqué ce problème. Lorsque vous utilisez la commande $ .blockUI(), elle supprime d'abord les divs blockUI existants sur la page. J'avais demandé si je pouvais cibler un div spécifique, mais seulement un div existe sur la page à un moment, donc ma question était inutile. Pardon! En conséquence, tout ce que j'ai à faire est de donner un identifiant à la div que je vérifie, puis de vérifier s'il existe sur la page. Je suis en mesure de simplifier le code et résoudre mon problème:

Nouveau code:

function unblockPage() { 
    // Check if the timer has run yet, and if it hasn't, cancel it 
    if ($("#divBlockPage").length > 0) { 
     document.body.style.cursor = "default"; 
     $.unblockUI(); 
    } 
    else { 
     clearTimeout(blockTimer); 
    } 
} 

// Blocks page UI. 
function blockPage() { 
    document.body.style.cursor = "wait"; 
    var loadingMessage = '<div id="divBlockPage" style="padding-top:30px;min-height:75px;font-weight:bold;font-size:12pt;"><img align="absmiddle" src="../Images/ajax-loader.gif" /> Please wait...</div>'; 
    $.blockUI({ centerX: true, centerY: true, css: { backgroundColor: '#ebebeb', color: '#000' }, message: loadingMessage }); 
} 
1

Ne semble pas avoir cette option. Jetez un oeil à simplemodal. Je pense bascule la casbah moi-même ces jours-ci. Je sais que tu pourrais être lié à Blockui mais j'ai pensé que je le mentionnerais.

+0

Merci pour l'info! Le modèle simplemodal est très joli, et je pourrais l'utiliser pour de futurs projets. Il s'est avéré que j'étais trop compliqué mon problème, et j'ai posté ma «solution» ci-dessous. – Pandincus

Questions connexes