जेएसएफ कस्टम घटक AJAX अद्यतन

Question

पर इनपुट फोकस खो रहा है मैं जेएसएफ 2.1.3 के साथ एक सीखने के अभ्यास के रूप में एक स्वत: पूर्ण कस्टम घटक लिख रहा हूं। विचार (जो शायद बहुत परिचित है) और इनपुट घटक में कुछ पाठ दर्ज करना और मिलान मूल्यों के साथ एक सूची बॉक्स प्रस्तुत करना है। विचार इनपुट पर एक कुंजीपटल जावास्क्रिप्ट ईवेंट है जो घटक को अद्यतन करने के लिए jsf.ajax.request() पर कॉल करता है। अब तक मैं एक घटक है जो मैं की तरह शामिल कर सकते हैं इस:

<mycc:autocomplete id="myauto" searchMethod="#{bean.doSearch}"/> 

यह एचटीएमएल इस तरह प्रस्तुत करता है:

<span id="myauto"> 
    <input type="text" id="myauto_input" name="myauto_input" 
    onkeyup="com.myco.ajaxRequest(this, event)"/> 
    <select id="myauto_listbox" name="myauto_listbox"> 
    <option value="1st">First</option> 
    <option value="2nd">Second</option> 
    </select> 
</span> 

com.myco.ajaxRequest() जावास्क्रिप्ट समारोह (KeyUp) करता है इस:

jsf.ajax.request(comp, null, { 
       execute: 'myauto', 
       render: 'myauto' 
       }); 

तो क्योंकि मैं पुनर्निर्माण और सूची, मैं कर रहा हूँ फिर से प्रतिपादन कस्टम घटक 'myauto' सुझावों के साथ लिस्टबॉक्स rerender करना चाहते हैं। निष्पादन निर्दिष्ट करके: 'myauto' decode() विधि निष्पादित करता है और मैं इनपुट मान प्राप्त कर सकता हूं। द्वारा प्रस्तुत करना निर्दिष्ट करें: 'myauto' एन्कोड ...() विधियों को HTML को पुन: उत्पन्न करने के लिए निष्पादित करें।

यह सब ठीक है लेकिन क्योंकि मैं myauto_input घटक के माता-पिता को प्रतिपादित कर रहा हूं, जब भी कुंजीपटल ईवेंट आग लगती है तो मैं इनपुट फोकस खो देता हूं।

अगर मैं की तरह कुछ निर्दिष्ट प्रस्तुत करना: 'myauto_listbox' (मैं केवल वास्तव में करना चाहते rerender लिस्टबॉक्स सब के बाद) समस्या यह है कि एनकोड ...() पद्धतियों निष्पादित नहीं है, क्योंकि वे के लिए कर रहे हैं संपूर्ण रूप से कस्टम घटक, केवल सूची बॉक्स नहीं। और यह एन्कोड में से एक में होगा ...() विधियों का उपयोग मैंने सुझावों वाले सूची बॉक्स को पुनर्निर्माण किया था।

घटक UIInput प्रदान करता है और मैं encodeEnd() विधि में एक अलग रेंडरर (componentFamily = "javax.faces.Input") में मार्कअप उत्पन्न (तो यह हमेशा चलाने वाले किसी भी आपूर्ति कनवर्टर के बाद - अभी तक लागू नहीं)। मुझे लगता है कि जो जावास्क्रिप्ट से फ़ोकस को मजबूर करना एक भयानक हैक है और इससे बचा जा सकता है।

मुझे थोड़ा अनिश्चितता है कि इसके साथ कहां जाना है, लेकिन मुझे संदेह है कि मैं जो देख रहा हूं इंगित करता है कि मैं किसी भी तरह गलत तरीके से इस पर आ रहा हूं। यदि कोई सही दिशा में इंगित करने के लिए पर्याप्त होगा, तो मैं की सराहना करता हूं।

Answer 1

मैं कुछ समय बिताया है इस और एक ajax अद्यतन के बाद फोकस खोने के सामान्य मुद्दे को देख काफी आम है और जिम Driscoll के blog में वर्णन किया गया ( देख 'फोकस रखते हुए')।

अपने कस्टम घटक के मामले में मैं (लगता है कि मैं ...) कस्टम घटक ही जो इनपुट के माता-पिता है अद्यतन करने के लिए है, तो मैं ajax के परिणामस्वरूप फोकस कम करने के लिए जा रहा हूँ अद्यतन करें, और यह वही तरीका है। इस तरह मैंने देखा है कि को फोकस को पुनर्स्थापित करने के लिए क्या किया जाना चाहिए, और ऐसा लगता है कि मेरे रेंडरर एन्कोड में मुझे बस जबरन इनपुट पर फ़ोकस बहाल करना होगा, लेकिन केवल ऑनकीप ईवेंट से भेजे गए POST का जवाब देने पर jsf.ajax.request। मैं jQuery का उपयोग करता हूं और बस कॉल करता हूं।फोकस() पर्याप्त नहीं है क्योंकि आपको किसी भी मौजूदा इनपुट के अंत में कर्सर की स्थिति भी प्राप्त करनी होगी। नीचे इस कोड को काम करने के लिए लगता है ठीक:

<script> 
    jQuery(function($){var cid='#myauto_input';$(cid).focus().focus().click();$(cid).val($(cid).val());}); 
</script> 

(ध्यान दें:।। .focus() ध्यान केंद्रित() क्लिक करें() IE8 के लिए आवश्यक है, बस .focus() क्रोम पर काम करता है ...)

तो ऐसा लगता है कि भयानक हैक ने दिन बचा लिया है। मुझे आश्चर्य हुआ कि कोई अंतर होगा यदि मैंने jsf AJAX लाइब्रेरी की बजाय jQuery AJAX रूटीन का उपयोग किया लेकिन मुझे नहीं लगता कि इससे कोई फर्क पड़ता है।