2013-04-01 10 views
7

जेएसएफ (विशेष रूप से प्राइमफेस) में AJAX बटन को संसाधित करते समय माउस कर्सर के रूप को व्यस्त मोड में बदलना संभव है (उदाहरण के लिए: घंटा ग्लास)? मैं अपने कर्सर के रूप को बदलना चाहता हूं जबकि मेरा पी: डेटाटेबल डेटा लोड कर रहा है जब मैं इसे अगले पृष्ठ पर नेविगेट करता हूं। धन्यवाद।प्राइमफेस AJAX अनुरोध प्रगति पर है जब प्राइमफ़ेस AJAX अनुरोध प्रगति पर है

उत्तर

9

आप सीएसएस और jQuery की थोड़ी सी सहायता से इस लक्ष्य को हासिल कर सकते हैं। सीएसएस के साथ, आप एक वर्ग बना सकते हैं जो कर्सर को पूरे दस्तावेज़ पर बदल देता है। JQuery के साथ, आप उस सीएसएस वर्ग को जोड़/हटा सकते हैं। कवर के तहत, प्राइमफेस AJAX जादू के लिए jQuery का उपयोग करता है और आप प्राइमफ़ेस < मानक jQuery ajaxStart और ajaxStop ईवेंट पर प्राइमफ़ेस 4+ हुक प्राइमफ़ेस विशिष्ट pfAjaxSend और pfAjaxComplete ईवेंट को उस सीएसएस क्लास के एड/निकालने के लिए कर सकते हैं।

सीएसएस:

html.progress, html.progress * { 
    cursor: progress !important; 
} 

(!important किसी भी शैली मामले के लिए style विशेषता और मजबूत CSS चयनकर्ताओं द्वारा निर्धारित ओवरराइड करता है कि)

jQuery और PrimeFaces:

$(document).on("ajaxStart pfAjaxSend", function() { 
    $("html").addClass("progress"); 
}).on("ajaxStop pfAjaxComplete", function() { 
    $("html").removeClass("progress"); 
}); 

के लिए मामला आप मानक जेएसएफ <f:ajax> अन्य जगहों का उपयोग कर रहे हैं और डब्ल्यू ould ही प्रगति संकेतक लेना पसंद, यहाँ आप यह कैसे कर सकते हैं:

jsf.ajax.addOnEvent(function(data) { 
    $("html").toggleClass("progress", data.status == "begin"); 
}); 

यह भी OmniFaces showcase application द्वारा प्रयोग किया जाता है। जब आप this page पर मतदान चलाते हैं तो आप इसे दूसरों के बीच देख सकते हैं।

+0

धन्यवाद! मैं इसे आजमाऊंगा.. :) – David

0

प्राइमफेस स्वयं ऐसा नहीं दिखता है। इसमें कुछ घटक हैं जो आपको काम करते समय विज़ुअलाइज़ करने की अनुमति देते हैं (अजाक्सस्टैटस, ब्लॉकयूआई), लेकिन ऐसा नहीं लगता कि यह कर्सर के साथ कुछ भी करता है।

आपको ऐसा करने के लिए सीधे जावास्क्रिप्ट का उपयोग करना होगा। यह एक अच्छा विकल्प की तरह दिखता है।

change cursor to busy while page is loading

+0

मुझे लगता है .. आशा है कि इसे जल्द ही इसके घटकों में जोड़ा जाएगा .. वैसे भी आपके उत्तर के लिए धन्यवाद :) – David

संबंधित मुद्दे