Comment utiliser jQuery BlockUI dans la page principale pour charger .. S'il vous plaît attendre Message

Question

je dois mettre en œuvre jquery BlockUI pour mon application .. J'ai ce code ..

$.blockUI({ css: { 
      border: 'none', 
      padding: '15px', 
      backgroundColor: '#000', 
      '-webkit-border-radius': '10px', 
      '-moz-border-radius': '10px', 
      opacity: .5, 
      color: '#fff' 
     } }); 

     setTimeout($.unblockUI, 2000); 
    }); 

Je garde ce code dans chaque cliquez sur la fonction dans mes vues .. alors ça marche bien. mais je dois centraliser ce code en gardant ce code dans le fichier master si quelque chose prend plus de 2000 millisecondes puis-je montrer jQuery BlockUI? pour toute mon application. Si oui, s'il vous plaît quelqu'un peut-il m'aider à garder ce code dans la page maître quel genre de code que j'ai besoin de mettre en œuvre dans la page maître pour accéder à ce blockUI jQuery?

Answer 1

Je fais de cette façon:

Dans le masterpage j'ai ajouté la référence de script et une référence à un script personnalisé où je le code suivant

//Set Defaults values for blockUI 
$.blockUI.defaults.theme = true; 
$.blockUI.defaults.title = 'Please wait...'; 
$.blockUI.defaults.message = '<img src="_assets/images/blockUI_Loader.gif" />'; 
$.blockUI.defaults.css = {}; 
$.blockUI.defaults.themedCSS = {}; 
$.blockUI.defaults.themedCSS.width = 100; 
$.blockUI.defaults.themedCSS.height = 64; 
$.blockUI.defaults.overlayCSS = {}; 
$.blockUI.defaults.overlayCSS.backgroundColor = '#ffffff'; 
$.blockUI.defaults.overlayCSS.opacity = 0.6; 

Puis, quand je dois l'utiliser dans appels ajax J'utilise simplement

$("#element").block(); 
$.ajax({ 
    type: "get", 
    dataType: "html", 
    url: "some/url", 
    data: {}, 
    success: function (response, status, xml) { 
     $("#element").unblock(); 
    }, 
    error: function (response) { 
     $("#element").unblock(); 
    } 
}); 

Answer 2

Pour le rendre accessible partout, sans l'écrire encore et encore, vous pouvez placer le code dans une fonction()

par exemple, placez dans votre fichier global javascript:

function blockUI(){ 
// $.blockUI({ css: {... 
} 

Ensuite, partout où vous en avez besoin, appelez blockUI();