dataTable使用具有数百万数据的Ajax函数

时间:2016-08-28 07:36:52

标签: jquery ajax datatables

我有一个带有数据表的搜索页面,其中包含从数据库中提取的数百万行数据。 我被困在如何将ajax数据与deferRender一起使用并将数据集作为数据集传递给数据表。

请参阅下面的我的数据表代码,然后我有三个查询:

1。我想知道如何将迭代和间隔数据传递给    使用回调的数据表??? 2.如何将图像列传递给    pdf出口? (以下代码中的dataURL不是预期的    结果)
3.所有方法都可以用来加快流程的进度?

数据表代码:

$('#resultTable').DataTable( {                      
                destroy: true,  
                "autoWidth": false,    
                processing: true,
                "serverSide": true,             
                //"aaData": result,  // THIS IS WORKING FINE IF THE AJAX RESULT GIVEN DIRECTLY, BUT LOADING WILL TAKE MUCH TIME
                ajax: {
                    type: 'POST',
                    url: 'search.php',
                    dataType: 'json',
                    data: { durationFrom: durationFrom, durationTo: durationTo, type: type, color: color, city: city, number: number },      
                    success:function(result){ 
                        data = result;
                        var out = [];

                        for ( var i=0; i<data.length ; i++ ) {
                            out.push( [ data[i].id, data[i].eventtime, data[i].number, data[i].imageURL ] );
                        }

                        setTimeout( function () {
                            callback( {
                                draw: data.draw,
                                data: out,
                                recordsTotal: data.length,
                                recordsFiltered: data.length
                            } );
                        }, 50 );
                    }                       
                },
                "aoColumns": [
                    { "sTitle": "Id",
                    "mDataProp": "id",
                     "sWidth" : "50px" },                               
                    { "sTitle": "Date",
                    "mDataProp": "eventtime",
                     "sWidth" : "120px" },
                    {"sTitle": "Number",
                     "mDataProp": "number",
                     "sWidth" : "50px" },                  
                    {"sTitle": "Image",
                     "mDataProp": "imageURL",
                        "render": function(mDataProp, type, row) {
                            return '<img src="'+mDataProp+' " alt="No image available" />';
                            },
                     "sWidth" : "50px"
                    }
                ],
                //deferRender:    true,
                scrollY:        400,
                "bSortClasses": false,
                info: true,
                language: {
                        "zeroRecords": "No matching records found - Please search with different search criteria",
                            "emptyTable": "No data available in table",
                        "infoEmpty": "No entries to show",
                            "info": "Records _START_ to _END_ of _MAX_",
                        "loadingRecords": "Loading...",
                        "Processing":  "<img src='images/loader.gif' alt='Processing... Please wait...'>",
                        "LoadingRecords": 'Loading...',
                        "search":         "Search:",
                        "paginate": {
                            "first":      "First",
                            "last":       "Last",
                            "next":       "Next",
                            "previous":   "Previous"
                        },
                    },
                aaSorting : [[0, 'desc']],
                "pagingType": "input",  
                "pageLength": 100,
                "lengthMenu": [[100, 500, 1000, 10000], [100, 500, 1000, 10000]],
                dom: 'Blfrtip',
                buttons: [
                    'copy',
                    {
                        extend: 'csv',
                        title: myFileName
                    },
                    {
                        extend: 'excelHtml5', 
                        title: myFileName
                    },
                     'print' , 
                    {
                        extend: 'pdfHtml5', 
                        title: myFileName  ,
                        exportOptions: {
                            columns: [0, 1, 2, 3, 4],
                            stripHtml: false
                        },
                        customize: function (doc) {

                            for (var i=1;i<doc.content[1].table.body.length;i++) {

                                var imageMarkUp = doc.content[1].table.body[i][4].text;
                                var srcImg = $(imageMarkUp).attr('src');


                                var img = new Image,
                                    canvas = document.createElement("canvas"),
                                    ctx = canvas.getContext("2d"),
                                    src = srcImg; 

                                img.crossOrigin = "Anonymous";

                                img.onload = function() {
                                    canvas.width = img.width;
                                    canvas.height = img.height;
                                    ctx.drawImage( img, 0, 0 );
                                    localStorage.setItem( "savedImageData", canvas.toDataURL("image/png") );
                                }
                                var dataURL = canvas.toDataURL("image/png");                                            
//NOT WORKING Correctly

                                if (doc.content[1].table.body[i][4].text == img.src) {
                                    delete doc.content[1].table.body[i][4].text;
                                    doc.content[1].table.body[i][4].image = 'img';
                                }
                            }

                            doc.content.splice(4, 0, {
                                margin: [0, 0, 0, 12],
                                alignment: 'center',
                                image: dataURL
                            });
                        }
                    }
                ]
            }); 

0 个答案:

没有答案