यह निर्धारित करने के लिए कि जब jQuery डेटाटेबल बनाया गया है और डेटा

Question

के साथ लोड किया गया है, तो मैं jQuery datatables का नवीनतम संस्करण उपयोग कर रहा हूं। क्या कोई कॉलबैक फ़ंक्शन है जिसका उपयोग डेटा लोड होने के बाद और डेटाटेबल में प्रदर्शित होने के बाद ही किया जा सकता है?

मेरे पास एक डेटाटेबल है कि मैं IE8 में प्रयोग कर रहा हूं। मेरे पास डेटा के 2 सेट हैं जिनके साथ मैं परीक्षण कर रहा हूं (जिनमें से मैं एक समय में केवल एक का उपयोग करता हूं)। मेरे पास एक जावास्क्रिप्ट सरणी है और डेटा का एक सेट है जो मुझे अजाक्स कॉल से मिलता है। मैं ASP.NET MVC 3 का उपयोग कर रहा हूं।

विन्यास कि एक अजाक्स कॉल से अपने डेटा हो जाता है:

$('#banks-datatable').dataTable({ 
    "bProcessing": true, 
    "sAjaxSource": '/Administration/Bank/List', 
    "aoColumns": [ 
      { "sTitle": "Engine" }, 
      { "sTitle": "Browser" }, 
      { "sTitle": "Platform" }, 
      { "sTitle": "Version" }, 
      { "sTitle": "Grade" } 
    ], 
    "bAutoWidth": false, 
    "bFilter": false, 
    "bLengthChange": false, 
    "iDisplayLength": 10 
}); 

alert('test'); 

जब मेरे datatable (कोई डेटा के साथ) इस तरह से datatable बनाई गई है भरी हुई है और प्रसंस्करण बॉक्स प्रदर्शित करता है और चेतावनी पॉपअप प्रदर्शित करता है। इस बिंदु पर डेटाटेबल है लेकिन डेटाटेबल में कोई डेटा लोड नहीं किया गया है। केवल जब पॉपअप चला जाता है (जब मैं पॉपअप पर ठीक बटन क्लिक करता हूं) तो डेटा डेटाटेबल में लोड हो जाता है। ऐसा क्यों है?

विन्यास कि JavaScript शृंखला से अपने डेटा हो जाता है:

var aDataSet = [ 
    ['Trident', 'Internet Explorer 4.0', 'Win 95+', '4', 'X'], 
    ['Trident', 'Internet Explorer 5.0', 'Win 95+', '5', 'C'], 
    ['Trident', 'Internet Explorer 5.5', 'Win 95+', '5.5', 'A'], 
    ['Trident', 'Internet Explorer 6', 'Win 98+', '6', 'A'], 
    ['Trident', 'Internet Explorer 7', 'Win XP SP2+', '7', 'A'], 
    ['Trident', 'AOL browser (AOL desktop)', 'Win XP', '6', 'A'], 
    ['Gecko', 'Firefox 1.0', 'Win 98+/OSX.2+', '1.7', 'A'] 
]; 

$('#banks-datatable').dataTable({ 
    "aoColumns": [ 
      { "sTitle": "Engine" }, 
      { "sTitle": "Browser" }, 
      { "sTitle": "Platform" }, 
      { "sTitle": "Version" }, 
      { "sTitle": "Grade" } 
    ], 
    "bAutoWidth": false, 
    "bFilter": false, 
    "bLengthChange": false, 
    "iDisplayLength": 10, 
    "aaData": aDataSet 
}); 

alert('test'); 

datatable बनाई गई है और डेटा लोड किया जाता है और उसके बाद ही पॉपअप प्रदर्शन करता है। यह पहले परिदृश्य से अलग है। यह एक केस क्यों है?

यदि मैं पहले परिदृश्य के साथ जाता हूं, तो क्या कोई तरीका है कि मैं निर्धारित कर सकता हूं कि डेटाटेबल को डेटा के साथ बनाया गया है और लोड किया गया है?

इस चेक के साथ मैं इसे सामान्य होना चाहता हूं ताकि इसका उपयोग किया जा सके, मैं इसे डेटा के साथ लोड करने का फैसला करता हूं।

Answer 1

आप fnDrawCallback फ़ंक्शन का उपयोग कर सकते हैं। टेबल तैयार होने पर हर बार इसे बुलाया जाता है। इसमें तालिका शामिल होगी, जब डेटा को डेटा, सॉर्ट या फ़िल्टर किया जाता है।

Answer 2

मुझे हमेशा जावास्क्रिप्ट को एकल थ्रेड होने के लिए जाना जाता है। यहाँ एक पोस्ट है कि समर्थन करने के लिए है:

Is JavaScript guaranteed to be single-threaded?

पहले परिदृश्य आप सर्वर से डेटा हो रही है, और फिर एक चेतावनी बॉक्स के साथ धागा पकड़ में। दूसरे परिदृश्य में आप डेटा को पूर्व-पॉप्युलेट करते हैं। मेरा मानना ​​है कि यह अंतर है।

यह पृष्ठ दिखाता है कि कैसे सफलता पर एक कॉलबैक कॉल करने के लिए:

http://datatables.net/usage/callbacks#fnServerData

// POST data to server 
$(document).ready(function() { 
    $('#example').dataTable({ 
    "bProcessing": true, 
    "bServerSide": true, 
    "sAjaxSource": "xhr.php", 
    "fnServerData": function (sSource, aoData, fnCallback) { 
     $.ajax({ 
     "dataType": 'json', 
     "type": "POST", 
     "url": sSource, 
     "data": aoData, 
     "success": fnCallback 
     }); 
    } 
    }); 
}); 

Answer 3

बेहतर होगा कि तुम का उपयोग fnInitComplete:

$(document).ready(function() { 
    $('#example').dataTable({ 
     "fnInitComplete": function (oSettings, json) { 
      alert('DataTables has finished its initialisation.'); 
     } 
    }); 
}) 

Answer 4

तुम भी "सफलता" के लिए remplacement रूप dataSrc उपयोग कर सकते हैं चूंकि इसे ओवरलोड नहीं किया जाना चाहिए:

यहां डेटाटेबल्स के टिपिकल उदाहरण के साथ।शुद्ध

var table = $('#example').DataTable({ 
    "ajax": { 
      "type" : "GET", 
      "url" : "ajax.php", 
      "dataSrc": function (json) { 
       //Make your callback here. 
       alert("Done!"); 
       return json.data; 
       }  
      }, 
    "columns": [ 
      { "data": "name" }, 
      { "data": "position" }, 
      { "data": "office" }, 
      { "data": "extn" }, 
      { "data": "start_date" }, 
      { "data": "salary" } 

     ] 
    }); 

Answer 5

DataTable JQuery के नए संस्करण पर, विधि कहा जाता है: initComplete

https://datatables.net/reference/option/initComplete