डेटाटेबल्स सेल पर बटन डालने में असफल

Question

मैं JQuery डेटाटेबल्स में बटन डालने का प्रयास कर रहा हूं लेकिन ऐसा लगता है कि जब बटन दबाया जाता है, तो कुछ भी नहीं होता है।

कोड (JQuery DataTable के लिए) इस प्रकार है:

  var oTable = $('#example').dataTable({ 
       "aaData": movieclips, 
       "bProcessing": true, 
       "bAutoWidth": false, 
       "fnInitComplete": function() { 
           var oSettings = this.fnSettings(); 
           for (var i=0 ; i<oSettings.aoPreSearchCols.length ; i++){ 
            if(oSettings.aoPreSearchCols[i].sSearch.length>0){ 
             $("tfoot input")[i].value = oSettings.aoPreSearchCols[i].sSearch; 
             $("tfoot input")[i].className = ""; 
            } 
           } 
          }, 
       "aoColumns": [ 
        { 
         "sTitle": "Title", 
         "sClass": "center", 
         "sWidth": "80%" 
        }, 
        { 
         "sTitle": "Video URL", 
         "sClass": "center", 
         "fnRender": function(obj) { 
          var sReturn = obj.aData[ obj.iDataColumn ]; 
          var returnButton = "<input class='approveButton' type='button' name='" + sReturn + "' value='Play'></input>"; 
          return returnButton; 
         }, 
         "sWidth": "20%" 
        } 
       ] 
      }); 

approveButton समारोह इस प्रकार है:

 $(".approveButton").click(function() { 
      alert(this.name); 

      try { 
       alert(this.name); 
      } finally { 
       return false; 
      } 
     } 

किसी भी इनसाइट?

Answer 1

यदि आप $(".approveButton").click(...) के साथ हैंडलर असाइन करते हैं तो यह केवल उन तत्वों पर लागू होगा जो उस समय ".approveButton" चयनकर्ता से मेल खाते हैं। यही है, बाद में बनाए गए तत्व स्वचालित रूप से अपने स्वयं के हैंडलर नहीं प्राप्त करेंगे। मुझे लगता है कि है कि समस्या यह है यह सोचते हैं रहा हूँ - नहीं यदि आप उपेक्षा कर सकते हैं निम्नलिखित ...

सौभाग्य से वहाँ एक हैंडलर कि स्वचालित रूप से तत्व भविष्य में बनाए जाते हैं मिलान पर काम करेंगे बनाने के लिए एक तंत्र है:

$(document).on("click", ".approveButton", function() { 
    // your function code here 
}); 

सूचना है कि प्रारंभिक चयनकर्ता document है - यह काम करेगा, लेकिन आप इसे एक माता पिता के तत्व पर करीब स्थापित करना चाहिए ऊपर अपने बटन के लिए यदि आप कर सकते हैं, तो शायद निम्नलिखित:

$("#example").on("click", ".approveButton", function() { /* your code */ }); 

(मैं कर रहा हूँ सुनिश्चित नहीं है कि "#example" है या नहीं इस उद्देश्य के लिए सबसे उपयुक्त माता-पिता, लेकिन आप अपना कोई भी HTML नहीं दिखाते हैं, इसलिए ...)

अधिक जानकारी के लिए the jQuery doco for .on() पर एक नज़र डालें।

या, आप jQuery 1.7 से अधिक उम्र के एक संस्करण उपयोग कर रहे हैं आप उपयोग कर सकते `.delegate()'

Answer 2

आप jQuery < 1.7 का उपयोग करते हैं आप delegate() का उपयोग करें या रहते हैं()

$(".approveButton").live('click', function() { 
     alert(this.name); 

     try { 
      alert(this.name); 
     } finally { 
      return false; 
     } 
    } 

    $("body").delegate(".approveButton", "click", function() { 
     alert(this.name); 

     try { 
      alert(this.name); 
     } finally { 
      return false; 
     } 
    } 

चाहिए अन्यथा on() का उपयोग जैसा कि nnnnnn