अजाक्स अपडेट (अपडेट पैनेल)

Question

के बाद jQuery में घटनाओं को रिबाइंड करना मेरे पृष्ठ पर मेरे पास कई इनपुट और विकल्प तत्व हैं, प्रत्येक (अच्छी तरह से) एक बार बदलते समय पृष्ठ पर कुछ पाठ अपडेट करने के लिए एक ईवेंट संलग्न होता है। मैं jQuery का उपयोग करता हूं जो वास्तव में वास्तव में अच्छा है :)

मैं अद्यतन पैनेल का उपयोग करते हुए माइक्रोस्कोफ्ट Ajax ढांचे का भी उपयोग करता हूं। कारण मैं ऐसा करता हूं कि कुछ सर्वर-साइड तर्क के आधार पर पृष्ठ पर कुछ तत्व बनाए जाते हैं। मैं वास्तव में यह नहीं समझाना चाहता हूं कि मैं अपडेटपेनल का उपयोग क्यों करता हूं - भले ही यह (0 काफी प्रयास के साथ) केवल jQuery का उपयोग करने के लिए पुनः लिखा जा सके, फिर भी मैं अपडेटपैनल चाहता हूं।

आपने शायद अनुमान लगाया - एक बार जब मैं अपडेटपेनल पर पोस्टबैक करता हूं तो jQuery ईवेंट काम करना बंद कर देता है। मैं वास्तव में इसकी उम्मीद कर रहा था, क्योंकि "पोस्टबैक" वास्तव में एक नया पोस्टबैक नहीं है, इसलिए दस्तावेज़ में मेरा कोड। पहले से ही घटनाओं को बांधने से फिर से नहीं निकाल दिया जाएगा। मैंने jQuery सहायता पुस्तकालयों में इसे पढ़ने के द्वारा भी अपने संदेह की पुष्टि की।

वैसे भी मुझे अपडेट नियंत्रण को DOM अद्यतन करने के बाद मेरे नियंत्रण को पुन: स्थापित करने की समस्या के साथ छोड़ दिया गया है। मुझे अधिमानतः ऐसे समाधान की आवश्यकता है जिसके लिए पृष्ठ पर अधिक .js फ़ाइलें (jQuery प्लग-इन) जोड़ने की आवश्यकता नहीं है, लेकिन अपडेटपेनल के 'आफ्टरअपडेटिंग' को पकड़ने में सक्षम होने के समान कुछ आसान है, जहां मैं केवल सभी फॉर्म तत्वों को पुन: स्थापित करने के लिए अपनी विधि को कॉल कर सकता हूं ।

Answer 1

आप ASP.NET AJAX का उपयोग कर रहे हैं, इसलिए आपको एक pageLoad ईवेंट हैंडलर, कि हर बार पृष्ठ पोस्ट वापस बुलाया जाता है का लाभ उठा सकेंगे यह पूर्ण या एक UpdatePanel से आंशिक हो। आपको बस फ़ंक्शन को अपने पृष्ठ पर रखना होगा, कोई हुकिंग अप की आवश्यकता नहीं है।

function pageLoad(sender, args) 
{ 
    if (args.get_isPartialLoad()) 
    { 
     //Specific code for partial postbacks can go in here. 
    } 
} 

Answer 2

आप jQuery और ईवेंट प्रतिनिधिमंडल का उपयोग कर सकते हैं। मूल रूप से प्रत्येक तत्व के बजाय कंटेनरों को घटनाओं को हुक करें और उस पर आधारित event.target और रन स्क्रिप्ट पूछें।

इसमें कई फायदे हैं कि आप कोड शोर को कम करते हैं (पुनर्निर्मित करने की कोई आवश्यकता नहीं है)। यह ब्राउज़र मेमोरी (डीओएम में बाध्य कम घटनाओं) पर भी आसान है

त्वरित उदाहरण here। आसान घटना प्रतिनिधिमंडल के लिए

jQuery plugin।

पीएस मैं 99% निश्चित प्रतिनिधिमंडल अगली रिलीज पर jQuery कोर में होगा।

Answer 3

Sys.Application.add_load(initSomething); 
function initSomething() 
{ 
    // will execute on load plus on every UpdatePanel postback 
} 

Answer 4

या आप on() विधि के माध्यम से नवीनतम jQuery की लाइव कार्यक्षमता देख सकते हैं। कोड

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded); 

function pageLoaded(sender, args) { 
    var updatedPanels = args.get_panelsUpdated(); 
    // check if Main Panel was updated 
    for (idx = 0; idx < updatedPanels.length; idx++) { 
     if (updatedPanels[idx].id == "<%=upMain.ID %>") { 
      rebindEventsForMainPanel(); 
      break; 
     } 
    } 
} 

Answer 5

उपयोग आप कोड है कि आप हर बार है कि UpdatePanel AsyncPostBack करता है पर अमल की जरूरत है डाल सकते हैं "अगर"।

Answer 6

  <script type="text/javascript"> 
      function pageLoad() { 

       if (Sys.WebForms.PageRequestManager.getInstance().get_isInAsyncPostBack()) { 


     } 

      </script> 

     </ContentTemplate> 
    </asp:UpdatePanel> 

की बातों का

Answer 7

jQuery की नई 'लाइव' विधि का उपयोग करके अपनी घटनाओं को बाध्य करें। यह आपके सभी मौजूदा तत्वों और भविष्य के सभी लोगों के लिए घटनाओं को बाध्य करेगा। चा चिंग!:)

Answer 8

निम्नलिखित कोड का उपयोग, आप नियंत्रण को मान्य करने की जरूरत है datapicker का उपयोग करेगा:

<script type="text/javascript" language="javascript"> 

     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(addDataPicker); 
     function addDataPicker(sender, args) 
     { 
      var fchFacturacion = document.getElementById('<%= txtFechaFacturacion.ClientID %>'); 
      if (fchFacturacion != null) { 
       $(fchFacturacion).datepicker({ onSelect: function() { }, changeMonth: true, changeYear: true, showOn: 'button', buttonImage: '../Imagenes/calendar.gif', buttonImageOnly: true});} 
     } 

    </script> 

    <asp:UpdatePanel ID="upEjem" runat="server" UpdateMode="Conditional"> 
     <ContentTemplate> 
       <div id="div1" runat="server" visible="false"> 
        <input type="text" id="txtFechaFacturacion" 
         name="txtFechaFacturacion" visible="true" 
         readonly="readonly" runat="server" /> 
       </div> 
     </ContentTemplate> 
    </asp:UpdatePanel> 

Answer 9

jQuery 1.7 के रूप में, यह करने के लिए सुझाया गया तरीका jQuery's .on() सिंटैक्स का उपयोग करने के लिए है।

सुनिश्चित करें कि आपने दस्तावेज़ ऑब्जेक्ट पर डीओएम ऑब्जेक्ट स्वयं नहीं किया है, तो सुनिश्चित करें। ...

$(':input').on('change', function() {...}); 

है क्योंकि: उदाहरण के लिए, इस UpdatePanel पोस्टबैक के बाद टूट जाएगा ': आदानों' फिर से लिखा गया है। बजाय यह करें:

$(document).on('change', ':input', function() {...}); 

जब तक दस्तावेज़ के आसपास है के रूप में, किसी भी आदानों (UpdatePanel ताज़ा करता है के लोग भी शामिल) परिवर्तन हैंडलर ट्रिगर किया जाएगा।