asp.net - जब मेरी प्रारंभिक पेज लोड पर ठीक काम करता है तो मेरी जेकयूआई यूआई दिनांकपिकर पोस्टबैक के लिए काम क्यों नहीं करता?




jquery user-controls (6)

जब आप कंट्रोल की Visible प्रॉपर्टी को false सेट false , तो यह बिल्कुल भी गाया नहीं जाता है।

इसका मतलब है कि अदृश्य पैनल के अंदर जावास्क्रिप्ट अस्तित्व में नहीं था जब पृष्ठ पहले लोड किया गया था।

इसका समाधान करने के लिए, आप Visible संपत्ति के बजाय अपने पैनल को सीएसएस ( display: none ) का उपयोग कर सकते हैं।

मैं अपने एएसपी.नेट वेबफॉर्म एप्लीकेशन में jQuery के यूआई दिनांकपिकर को एकीकृत करने का प्रयास कर रहा हूं। यह एप्लिकेशन सभी पृष्ठों पर एक सामान्य रूप प्रदान करने के लिए मास्टर पेजों का उपयोग करता है, और सभी सामग्री पृष्ठों को एक UpdatePanel की ContentTemplate के अंदर बनाया गया है। मैंने डेटक्कर की कार्यक्षमता लपेट करने के लिए उपयोगकर्ता के नियंत्रण को बनाया है और रनटाइम पर कोडबेहिंड से प्रत्येक डेट के लिए मिनेडेट, मैक्सडेट, वैलेटर्स आदि को सेट करने की अनुमति दी है। मुझे एएसपी.NET क्लाइंट तत्व आईडी बनाने के तरीके से निपटने की जरूरत भी है I

पिछले हफ्ते, मैंने उच्च और निम्न की खोज की है, और इसे काम करने के लिए बहुत सारी युक्तियां मिल गईं यहां कुछ हद तक सरलीकृत संस्करण है जहां मैं अभी ठीक हूं।

<asp:TextBox ID="txtTB" runat="server"
    MaxLength="10"
    CssClass="dateBox" />

<script type="text/javascript">

    // This function enables the datepicker behavior for this textbox by its ClientID.
    function <%=txtTB.ClientID %>() {
        $("#<%=txtTB.ClientID %>").datepicker({
            changeMonth: true, changeYear: true,
            showOn: 'button',
            buttonImage: "<%=Request.ApplicationPath %>/images/calendarIcon.gif",
            buttonImageOnly: true, buttonText: '', duration: '',
            onSelect: function() { }
        });
    };

    // Register the above function to execute on initial page load...
    $(document).ready(function(){ <%=txtTB.ClientID %>(); }) ;

    // ...and also after any update panel it's on has been refreshed. 
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(<%=txtTB.ClientID %>);

</script>

मैंने मान्यताओं और कुछ अन्य मार्कअप को छोड़ दिया है जो मुझे नहीं लगता है कि इस मुद्दे से संबंधित है, लेकिन यह उपयोगकर्ता नियंत्रण का मांस है - एक टेक्स्टबॉक्स, और jQuery स्क्रिप्ट, जो कि datepicker कार्यक्षमता को सक्षम करती है मूल विचार यह है कि एएसपी.नेट के क्लाइंट आईडी का लाभ उठाने के लिए:

  1. इस विशेष नियंत्रण के लिए जावास्क्रिप्ट फंक्शन के लिए एक अद्वितीय फ़ंक्शन नाम प्रदान करें
  2. प्रारंभिक पृष्ठ लोड के बाद datepicker को सक्षम करने के लिए jQuery के साथ उस फ़ंक्शन को पंजीकृत करें
  3. पोस्टबैक के बाद सक्षम दिनांकपिक्टर रखने के लिए एएसपी.नेट की पेजरक्वैस्ट मैनेजर के साथ उसी फ़ंक्शन को पंजीकृत करें

आइटम 1 और 2 महान काम कर रहे हैं हालांकि, एक पोस्टबैक के बाद, डेटपिकर की कार्यक्षमता खो जाती है और मैं सिर्फ एक टेक्स्ट बॉक्स के साथ छोड़ देता हूं

लेकिन रुकें! वह सब कुछ नहीं हैं। दिए गए पृष्ठ में कई पैनल होते हैं, जिनमें से केवल एक ही समय में दिखाई देता है। ये केवल वर्तमान पैनल के लिए दृश्यमान संपत्ति होने के कारण ही चुना जाता है। अन्य सभी पैनलों के लिए दृश्यमान संपत्ति गलत पर सेट की गई है

अब इसे प्राप्त करें: पहले पैनल पर तिथिपैकर, जो प्रारंभिक पृष्ठ लोड पर प्रदर्शित होता है, अपेक्षित काम करता है दूसरे पैनल पर जो लोग दिखाई नहीं देते हैं पहले पृष्ठ पर वापस जा रहे हैं, तिथि पलक फिर से दिखाई देते हैं।

क्या किसी के पास कोई विचार है जहां मैं गलत हो रहा हूं?


मुझे लगता है कि ऐसा करने का एक क्लीनर तरीका ClientScriptManager.RegisterStartupScript का उपयोग ClientScriptManager.RegisterStartupScript

जावास्क्रिप्ट:

function initCalendar(controlId) {
    $("#" + controlId).blahblah(....
}

आपके कोड के पीछे (शायद OnPreRender ):

Page.ClientScript.RegisterStartupScript(this.GetType(), "SomeName", string.Format("<script>initCalendar('{0}');</script>", txtBox.ClientID));

इसे अपडेट पैनल के अंदर आज़माएं

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>

        <script type="text/javascript">
        var prm = Sys.WebForms.PageRequestManager.getInstance();

        prm.add_endRequest(function() {
            var customer = document.getElementById("<%=cmbCustomers.ClientID%>").value;

            /* Jquery Functions Here*/
            $(document).ready(function() {
               ...
            });


        });
        </script>

कुंआ,

यहाँ इस समस्या का समाधान है नीचे दिए गए लिंक बताते हैं कि डेसपिकर एजेक्स पोस्टबैक और एजेएक्स के भीतर काम करने के लिए समाधान के बाद क्यों काम नहीं करता।

http://jquerybyexample.blogspot.com/2010/08/jquery-datepicker-does-not-work-after.html


बस के नीचे पेज_लोड कोड में कोड bellow का उपयोग करें ..

string DOB = Request.Form[TextBoxDOB.UniqueID];

TextBoxDOB.Text = DOB;

मैंने इसे लागू किया और एक जादू की तरह काम करता है


अगर आप अपडेट पैनल का उपयोग कर रहे हैं तो आतंक न हो तो बस यहां क्लिक करें और आराम करो। विस्तृत उत्तर