2012-01-09 14 views
5

प्रस्तुत करने के बाद इनपुट पर फ़ोकस सेट करें मेरे पास एक मॉडल है जिसमें 1 इनपुट है। इसके अलावा, मेरे पास एक संग्रह है। अब, जब मैं संग्रह में एक मॉडल जोड़ता हूं, तो मैं इसे अपने इनपुट पर फोकस सेट करना चाहता हूं। सटीक होने के लिए, मुझे नए बनाए गए मॉडल दृश्य के इनपुट पर ध्यान केंद्रित करने की आवश्यकता है।backbone.js:

हालांकि, मुझे यह काम करने के लिए प्रतीत नहीं होता है।

addOne: function(InvoiceItem) { 
    var view = new InvoiceItemView({model: InvoiceItem}); 
    this.$('tr[data-id="'+InvoiceItem.get('after')+'"]').after(view.render().el); 
    this.$('tr[data-id="'+InvoiceItem.cid+'"]').css('background', 'green'); 
    this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus(); 
}, 

समस्या है, तीसरे कॉल: this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus(); कुछ नहीं करता यहाँ मेरी समारोह संग्रह को देखने के लिए मॉडल की दृष्टि कहते हैं कि है। और यह अजीब है, क्योंकि ऐसा लगता है कि मैं रूट तत्व tr पर केवल डीओएम हेरफेर कर सकता हूं, और उसके अलावा कुछ भी नहीं।

ऐसा लगता है कि jQuery यह नहीं जानता कि तत्व मौजूद है, जो अजीब है, क्योंकि जब मैं alert(this.$('tr[data-id="'+InvoiceItem.cid+'"] input').length) करता हूं तो मुझे 1 मिलता है, जो इंगित करता है कि तत्व मौजूद है।

क्या है कि मैं यहां गलत कर रहा हूं?

उत्तर

19

_.defer का उपयोग करते हुए मेरी समस्या तय:

var $this = this; 
_.defer(function(){ 
    $this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus(); 
}); 
+0

यहां [दस्तावेज़ीकरण का लिंक] (http://underscorejs.org/#defer) है। –

2
this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus();

के बजाय

कोशिश इस

$(view.render().el).find('input').focus(); 
+0

काम करने के लिए प्रतीत नहीं होता है और मुझे लगता है कि मैं जानता हूँ कि क्यों: संग्रह दृश्य हो जाता है फिर से गाया क्योंकि संग्रह परिवर्तित होने पर मैं आइटम को दृश्य में जोड़ें। और पुन: प्रस्तुत करने से किसी भी इनपुट से फोकस खो जाता है ... फिर से प्रस्तुत करने के बाद फोकस को पुनर्स्थापित करने का कोई तरीका है? – ragulka

+0

मेरा पहला अनुमान यह था कि ऐसा इसलिए होता है क्योंकि संग्रह दृश्य पुनः प्रस्तुत किया जाता है, लेकिन ऐसा लगता है कि यह मामला प्रतीत नहीं होता है (मैंने सरल अलर्ट() के साथ यह देखने के लिए प्रयास किया कि रेंडर ट्रिगर हो गया है या नहीं)। यह अजीब है क्योंकि यहां तक ​​कि अगर मैं सिर्फ $ ('इनपुट') करता हूं। छुपाएं() - यह कुछ भी नहीं करता है। संपादित करें: असल में ऐसा लगता है कि कभी-कभी, प्रमाणित समय बीतने के बाद, यह पहली पंक्ति के इनपुट को छिपाने लगता है – ragulka

+0

@ragulka क्या आप अपना संग्रह, मॉडल और कोड देख सकते हैं। शायद कुछ घटनाएं फायरिंग कर रही हैं जो इसे – Paul

2

मैं से मिलता-जुलता एक समस्या थी और यहां समाप्त हुए, जबकि एक समाधान के लिए खोज। आपकी पोस्ट कुछ महीने पहले थी, इसलिए शायद आप इसे पीछे ले गए हैं, लेकिन उम्मीद है कि यह किसी और की मदद करेगा। मैं jQuery's ready function handler का उपयोग कर समस्या को हल करने में सक्षम था। मैंने हमेशा सोचा कि इसका उपयोग केवल document पर किया जा सकता है लेकिन आप इसे सबनोड्स पर भी उपयोग कर सकते हैं। इस प्रयास करें:

addOne: function(InvoiceItem) { 
    var view = new InvoiceItemView({model: InvoiceItem}); 
    $('tr[data-id="'+InvoiceItem.get('after')+'"]').ready(function(){ 
     $('tr[data-id="'+InvoiceItem.cid+'"]').css('background', 'green'); 
     $('tr[data-id="'+InvoiceItem.cid+'"] input').focus(); 
    }); 
    $('tr[data-id="'+InvoiceItem.get('after')+'"]').after(view.render().el); 
}, 
+0

का कारण बन रही हैं, हालांकि इसे सबनोड्स पर इस्तेमाल किया जा सकता है, लेकिन यह सबनोड तैयार होने की प्रतीक्षा नहीं करेगा, लेकिन बस * डीओएम ** ** ** ** में हेरफेर करने के लिए प्रतीक्षा करें। यह $ '(फ़ंक्शन() {console.log ('ready')} का बिल्कुल वही प्रभाव है)' –