2011-09-16 10 views
8

मेरे पास सेल संपादन प्लगइन का उपयोग कर एक ग्रिड पैनल है।ExtJS 4 - ग्रिड में सशर्त रूप से सेल को कैसे संपादित करें?

इस ग्रिड पैनल में, मैं चाहता हूँ निम्नलिखित तरीके से एक सेल पर सशर्त संपादन:

जब सेल पर एक उपयोगकर्ता क्लिक संपादित करने के लिए, वहाँ से पता चला संवाद की पुष्टि किया जाना चाहिए - "आप सेल को संपादित करना चाहते हैं? " - अगर वह 'हां' चुनता है तो सेल केंद्रित होता है और संपादन शुरू होता है अन्यथा सेल स्थिर रहता है।

मैंने 'प्रीडेडिट' ईवेंट का उपयोग करने का प्रयास किया है, लेकिन उपयोगकर्ता तीर कुंजी का उपयोग करके मानों को संशोधित करने में सक्षम है (जैसा कि संपादक एक नंबरफील्ड है) भले ही पुष्टि बॉक्स प्रदर्शित किया जा रहा हो, यानी माउस- क्लिक अक्षम है लेकिन तीर कुंजियां अभी भी फ़ील्ड के मान को बदल सकती हैं।

इसके अलावा, जब उपयोगकर्ता 'हां' चुनता है तो सेल फोकस खो देता है और मैं इसे 'हां' क्लिक के बाद सही संपादित करने में सक्षम नहीं हूं। मैंने 'फोकस' विधि का उपयोग करने की कोशिश की है लेकिन कोई भाग्य नहीं है।

इस पर कुछ गाइड हो सकता है?

अग्रिम धन्यवाद।

अधिक जानकारी:

मैं उपयोग करने की कोशिश - startEditByPosition() - सेल संपादन प्लगइन का कार्य जब उपयोगकर्ता चुनता है 'हां'। लेकिन फिर, इसके कारण, पुष्टिकरण बॉक्स वापस दिखाई देता है, जैसे 'हां' संपादन शुरू करने से पहले जो पहले से ईवेंट ईवेंट को कॉल करता है। कोई मदद?

उत्तर

16

आप कुछ ध्वज चर बना सकते हैं जैसे isEditAllowed। इसे beforeedit में देखें। यदि यह झूठा शो confirm है तो कुछ भी नहीं करें। यदि उपयोगकर्ता isEditAllowed से true और startEditByPosition सेट करने की पुष्टि करता है। edit में घटना false करने के लिए isEditAllowed सेट:

 plugins: [ 
      Ext.create('Ext.grid.plugin.CellEditing', { 
       clicksToEdit: 1, 
      listeners: { 
       'beforeedit': function(e) { 
       var me = this; 
       var allowed = !!me.isEditAllowed; 
       if (!me.isEditAllowed) 
        Ext.Msg.confirm('confirm', 'Are you sure you want edit?', function(btn){ 
        if (btn !== 'yes') 
         return; 
        me.isEditAllowed = true; 
        me.startEditByPosition({row: e.rowIdx, column: e.colIdx}); 
        }); 
       return allowed; 
       }, 
       'edit': function(e) { 
       this.isEditAllowed = false; 
       } 
      } 
      }) 
     ], 

Here is demo.

+0

उत्कृष्ट समाधान आण्विक मैन। साझा करने के लिए धन्यवाद। – netemp

+0

डेमो काम नहीं कर रहा है। – yurin

+1

@yurin, 2011 से बहुत सारी चीज़ें बदल गई हैं। संसाधन फ़ाइलों को extjs के साथ लिंक भी बदल गए हैं :) डेमो फिक्स्ड। धन्यवाद –

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