jQuery अद्यतन

Question

के साथ एएसपी.NET ग्रिड व्यू में 'अपडेट' पर क्लिक करें, मुझे एएसपीनेट ग्रिड व्यू में jQuery के साथ 'अपडेट' क्लिक ईवेंट कैप्चर करने की आवश्यकता है और कहां से शुरू करना है इसका कोई तरीका नहीं है। मैं अभी भी jQuery के लिए नया हूँ। मेरा ग्रिड व्यू SQLDataSource से जुड़ा हुआ है और, स्वाभाविक रूप से, सभी घंटियाँ और सीटी है कि वह संयोजन प्रदान करता है। किसी भी तरह की सहायता का स्वागत किया जाएगा।

Answer 1

आप स्क्रिप्ट ब्लॉक कहीं भी जोड़े जाने के बाद GridView घोषित किया जाता है और यह डिफ़ॉल्ट गैर टेम्प्लेट की GridView स्तंभ के साथ काम करना चाहिए। कोडबेइंड में कोई कोड नहीं है क्योंकि यह पूरी तरह जावास्क्रिप्ट समाधान है।

उपयोग यह आप एक लिंक प्रकार GridView स्तंभ उपयोग कर रहे हैं:

<script type="text/javascript"> 
    // a:contains(The text of the link here) 
    $('#<%= theGridViewID.ClientID %> a:contains(Update)').click(function() { 
     alert('Update click event captured from the link!'); 
     // return false: stop the postback from happening 
     // return true or don't return anything: continue with the postback 
    }); 
</script> 

उपयोग इस अगर आप एक बटन-प्रकार GridView स्तंभ का उपयोग कर रहे हैं और आप अपने जावास्क्रिप्ट पोस्टबैक ब्लॉक करने के लिए नहीं करना चाहती:

<script type="text/javascript"> 
    // :button[value=The text of the button here] 
    $('#<%= theGridViewID.ClientID %> :button[value=Update]').click(function() { 
     alert('Update click event captured from the button!'); 
    }); 
</script> 

उपयोग यह आप एक बटन-प्रकार GridView स्तंभ का उपयोग कर रहे हैं और आप नियंत्रण करने पोस्टबैक या नहीं के साथ जारी रखने के लिए है कि क्या चाहते हैं:

<script type="text/javascript"> 
    // :button[value=The text of the button here] 
    var updateButtons = $('#<%= theGridViewID.ClientID %> :button[value=Update]'); 
    updateButtons 
     .attr('onclick', null) 
     .click(function() { 
      alert('Update click event captured from the button!'); 
      var doPostBack = true; // decide whether to do postback or not 
      if (doPostBack) { 
       var index = updateButtons.index($(this)); 
       // 'Update$' refers to the GridView command name + dollar sign 
       __doPostBack('<%= theGridViewID.UniqueID %>', 'Update$' + index); 
      } 
     }); 
</script> 

---

अद्यतन: मुझे लगता है कि यह पिछले (3) स्क्रिप्ट मैं ऊपर प्रस्तुत ब्लॉक के प्रतिस्थापन में एक बेहतर समाधान हो जाएगा के बाद से आप मैन्युअल रूप से आदेश नाम के आधार पर __doPostBack समारोह कॉल अद्यतन करने के लिए की जरूरत नहीं होगी , और इस तरह, यह कम त्रुटि-प्रवण होना चाहिए:

<script type="text/javascript"> 
    // :button[value=The text of the button here] 
    var updateButtons = $('#<%= theGridViewID.ClientID %> :button[value=Update]'); 
    updateButtons.each(function() { 
     var onclick = $(this).attr('onclick'); 
     $(this).attr('onclick', null).click(function() { 
      alert('Update click event captured from the button!'); 
      var doPostBack = true; // decide whether to do postback or not 
      if (doPostBack) { 
       onclick(); 
      } 
     }); 
    }); 
</script> 

इस विचार के लिए अरिस्टोस को क्रेडिट। :)

Answer 2

आपको क्लाइंट-साइड इवेंट श्रोता को अपडेट [लिंक] बटन के क्लिक ईवेंट में संलग्न करने की आवश्यकता है। मुझे नहीं लगता कि यह AutoGenerateEditButton = "true" का उपयोग करके किया जा सकता है यदि आप इसे इस तरह से कर रहे हैं। आपको टेम्पलेटफ़ाइल का उपयोग करने की आवश्यकता होगी ताकि आप बटन को कुशल बना सकें। फिर आप बटन के क्लिक ईवेंट से जुड़ने के लिए jQuery का उपयोग कर सकते हैं।

Answer 3

कॉलम टेम्पलेट्स में अद्यतन कॉलम जोड़ें। इसे एक कस्टम कॉलम में कनवर्ट करें, और इसे इस तरह संशोधित करें कि आप इसे jquery i.e. के साथ हुक कर सकते हैं जैसे कि एक सीएसएस क्लास जोड़ना।

Answer 4

ठीक है यहां एक बटन से केवल एक अपडेट (या अधिक) को पकड़ने का मेरा समाधान है।

यह जावास्क्रिप्ट कोड है कि मैं अद्यतन क्लिक पर

<script type="text/javascript">   
    function NowRunTheUpdate(){ 
     alert("ok I capture you"); 
    } 
</script> 

चलाने के लिए और यहाँ है पेज कोड

`<asp:GridView ID="MyGridView" runat="server" OnRowDataBound="MyGridView_RowDataBound" ... >` 

    <asp:ButtonField Text="update" CommandName="Update" ButtonType="Button" /> 
    ... 

है यहाँ कोड के पीछे चलाने के लिए और जावास्क्रिप्ट सेट thats है।

protected void MyGridView_RowDataBound(object sender, GridViewRowEventArgs e) 
{ 
    if (e.Row.RowType == DataControlRowType.DataRow) 
    { 
     // loop all data rows 
     foreach (DataControlFieldCell cell in e.Row.Cells) 
     { 
      // check all cells in one row 
      foreach (Control control in cell.Controls) 
      { 
       // I go to get the button if exist 
       Button button = control as Button; 
       if (button != null && button.CommandName == "Update") 
        // Add delete confirmation 
        button.OnClientClick = "NowRunTheUpdate();"; 
      } 
     } 
    } 
} 

Answer 5

ग्रिडव्यू "tr" और "td" के समूह के साथ एक टेबल के अलावा कुछ भी नहीं है। यदि आप उस अवधारणा को समझते हैं तो क्लाइंट साइड पर कुछ भी संभालना आपके लिए आसान होगा। यदि आपने ऑटो सब कुछ सक्षम किया है तो यह एक लिंक होगा जो संपादन, हटाएं, अपडेट या रद्द करने के लिए परिणाम देगा (देखें स्रोत देखें)।- यह एक बटन, एक लिंक, या कुछ और है

$("a:contains(Update)").live("click", function() { 
    //alert("hi"); do what needs to be done 
    return false;//would not sent the control back to server 
    }); 

HTH