vendredi 19 octobre 2018

Datatable unable to export updated checkbox values in excel as 0 or 1, showing the initially checked values only

Trying to download Datatables, able to get 0 or 1 values for checkboxes (for one of the column fields) initially,but when I am toggling the checkbox and exporting as excel, unable to retrieve the latest check box values. Initially I only in the first excel imagehad the second checkbox as not ticked in the database so its correctly exporting its values as 0 in the excel sheet but when I change the values and export it again its not taking theupdated checkbox ticks updated latest values as you can see in the snapshot attached as well.

   var j=0;
    $(document).ready(function(){


    var table;
    function Xhr(id)
    {
    return $.ajax(
    {type:"GET",
    url:'http://localhost:8080/SSRSReports/v1/test',
    dataType:'json',
    cache:false,
    async:true,

    beforeSend:
    function(){$(id).append('<img src="images/spinner.gif" class="spin"/>');
    }})
    .always(function(){
    $(id).find('.spin').fadeOut(4000,function(){$(this).remove();
    });
    })
    .fail(function()
    {console.log("There was a problem while trying to get data at "+d);});
    }
    var radio=[];
    var j=0;
    $(document).ready(function(){
        Xhr('#report').done(function (json) {
                console.log(json);
                var x;
        
                        jQuery_2_2_2.each(json, function (i, report) {
                
                                radio.fill(0);
                                if(report.testSampleOutOfStabilityIndt==1)
                                        {
                                                x += '<tr><td>' + report.studyId + '</td>';
                                            x += '<td>' + report.country + '</td>';
                                            x += '<td>' + report.investigatorName + '</td>';
                                            x += '<td>' + report.screenId + '</td>';
                                                x += '<td>' + report.subjectId + '</td>';
                                                x += '<td>' + report.subjectInitials + '</td>';
                                                x += '<td>' + report.requisitionNumber + '</td>';
                                                x += '<td>' + report.testName + '</td>';
                                                x += '<td>' + report.visitName + '</td>';
                                                x += '<td>' + report.collectionDate + '</td>';
                                                x += '<td>' + report.collectionTime + '</td>';
                                                x += '<td>' + report.resultDate + '</td>';
                                                x += '<td>' + report.resultTime + '</td>';
                                                x += '<td>' + report.minutesToResult + '</td>';
                                                x += '<td>' + report.minutesSampleStabilityLimit + '</td>';
                                                x += '<td>' + report.testResult + '</td>';
                                                x += '<td>' + report.daysSampleStabilityLimit + '</td>';
                                                x += '<td>' + report.daysToResult + '</td>';
                                                x += '<td>' + report.testSampleOutOfStabilityIndt + '</td>';
                                        //console.log(i);
                                                if(j==1)
                                                        {
                                                        x += '<td id="verified'+j+'"><input id="verified'+j+'" style="font-size:xx-small;" type="checkbox" onclick="handleChange(this)"></td></tr>';
                                                        }
                                                else{
                                                        x += '<td id="verified'+j+'"><input id="verified'+j+'" style="font-size:xx-small;" type="checkbox" checked onclick="handleChange(this)"></td></tr>';
                                                }
                                                j++;
                                        
                                        }
                                
                        });//.each
                        jQuery_2_2_2('#reportbody').append(x);
                        
                        
                        table=jQuery_2_2_2('#reporttable').DataTable({
                                "stateSave": true,
                                checkboxRefresh:true,
                                dom: 'Bfrtip',
                            buttons: [
                                {
                                extend: 'excel',
                            exportOptions: {
                                orthogonal: 'sort'
                            }
                        }        
                    ],
                    columnDefs: [{
                       targets:[19],
                       render: function(data, type, row, meta){
                          if(type === 'sort'){
                             var $input = $(data).find('input[type="checkbox"]').addBack();
                             data = ($input.prop('checked')) ? "1" : "0";
                          }

                          return data;    
                       }
                    }],
                             
                            
                            scrollY:        true,
                            scrollX:        true,
                            scrollCollapse: true,
                            fixedColumns:   {
                                leftColumns: 1,
                                rightColumns: 1
                            }
                        
                            });//.datatable

                });//.done
                
        
                
    });//document.ready
    var k;

    function handleChange(e){
[enter image description here][1]
       $(e).attr('checked', !($(e).attr('checked')));  
        console.log(e.id);
        
        

        
    }
    th, td {
        white-space: nowrap;
    }

    div.dataTables_wrapper {
        width: 1600px;
        margin: 0 auto;
    }
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Reports</title>
    <script type="text/javascript"
        src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <link
        href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"
        type="text/css" rel="stylesheet" />
    <link
        href="https://cdn.datatables.net/fixedcolumns/3.2.6/css/fixedColumns.dataTables.min.css"
        type="text/css" rel="stylesheet" />
    <script src="https://code.jquery.com/jquery-2.2.2.min.js"
        integrity="sha256-36cp2Co+/62rEAAYHLmRCPIych47CvdM+uTBJwSzWjI="
        crossorigin="anonymous"></script>
    <script

        src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript"
        src="https://cdn.datatables.net/fixedcolumns/3.2.6/js/dataTables.fixedColumns.min.js"></script>
    <script
        src="https://cdn.datatables.net/buttons/1.5.2/js/dataTables.buttons.min.js"></script>
        <link
        href="https://cdn.datatables.net/buttons/1.5.2/css/buttons.dataTables.min.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript"
        src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script type="text/javascript"
        src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
    <script type="text/javascript"
        src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
    <script type="text/javascript"
        src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.html5.min.js"></script>
    <script type="text/javascript">var jQuery_2_2_2=$.noConflict(true);</script>

    </head>
    <body>
        <form id="myform">
                <div id="report" style="padding: 1% 1%">
                        <h2 class="section_header">
                                <span style="color: #18d1f2">RE</span>PORT
                        </h2>
                        </br>

                        <table id="reporttable" class="display" cellspacing="0" width="100%"
                                border="1px solid black" ; border-collapse="collapse";>
                                <thead>
                                        <tr>
                                                <th>StudyID</th>
                                                <th>Country</th>
                                                <th>Investigator_Name</th>
                                                <th>ScreenID</th>
                                                <th>SubjectID</th>
                                                <th>Subject_Initials</th>
                                                <th>Requisition_Number</th>
                                                <th>Test_Name</th>
                                                <th>Vist_Name</th>
                                                <th>Collection_Date</th>
                                                <th>Collection_Time</th>
                                                <th>Result_Date</th>
                                                <th>Result_Time</th>
                                                <th>MinutesToResult</th>
                                                <th>Minutes_Sample_Stability_Limit</th>
                                                <th>Test_Result</th>
                                                <th>Days_Sample_Stability_Limit</th>
                                                <th>DaysToResult</th>
                                                <th>Taste_Sample_Out_of_Stability_Ind</th>
                                                <th>Verified ?</th>


                                        </tr>
                                </thead>
                                <tbody id="reportbody">

                                </tbody>
                                <tfoot>
                                        <tr>
                                                <th>StudyID</th>
                                                <th>Country</th>
                                                <th>Investigator_Name</th>
                                                <th>ScreenID</th>
                                                <th>SubjectID</th>
                                                <th>Subject_Initials</th>
                                                <th>Requisition_Number</th>
                                                <th>Test_Name</th>
                                                <th>Vist_Name</th>
                                                <th>Collection_Date</th>
                                                <th>Collection_Time</th>
                                                <th>Result_Date</th>
                                                <th>Result_Time</th>
                                                <th>MinutesToResult</th>
                                                <th>Minutes_Sample_Stability_Limit</th>
                                                <th>Test_Result</th>
                                                <th>Days_Sample_Stability_Limit</th>
                                                <th>DaysToResult</th>
                                                <th>Taste_Sample_Out_of_Stability_Ind</th>
                                                <th>Verified?</th>


                                        </tr>
                                </tfoot>
                        </table>

                </div>
                <input
                        style="color: white; font-weight: bold; font-size: larger; width: 80px; height: 30px; background-color: deepskyblue; border: 1px solid #223445; border-radius: 18px; -webkit-border-radius: 5px; -moz-border-radius: 5px"
                        type="submit">
        </form>
    </body>
    <script>



        Xhr('#report').done(function (json) {
            console.log(json);
            var x;

                jQuery_2_2_2.each(json, function (i, report) {

                    radio.fill(0);
                    if(report.testSampleOutOfStabilityIndt==1)
                        {
                            x += '<tr><td>' + report.studyId + '</td>';
                            x += '<td>' + report.country + '</td>';
                            x += '<td>' + report.investigatorName + '</td>';
                            x += '<td>' + report.screenId + '</td>';
                            x += '<td>' + report.subjectId + '</td>';
                            x += '<td>' + report.subjectInitials + '</td>';
                            x += '<td>' + report.requisitionNumber + '</td>';
                            x += '<td>' + report.testName + '</td>';
                            x += '<td>' + report.visitName + '</td>';
                            x += '<td>' + report.collectionDate + '</td>';
                            x += '<td>' + report.collectionTime + '</td>';
                            x += '<td>' + report.resultDate + '</td>';
                            x += '<td>' + report.resultTime + '</td>';
                            x += '<td>' + report.minutesToResult + '</td>';
                            x += '<td>' + report.minutesSampleStabilityLimit + '</td>';
                            x += '<td>' + report.testResult + '</td>';
                            x += '<td>' + report.daysSampleStabilityLimit + '</td>';
                            x += '<td>' + report.daysToResult + '</td>';
                            x += '<td>' + report.testSampleOutOfStabilityIndt + '</td>';
                        //console.log(i);
                            if(j==1)
                                {
                                x += '<td id="verified'+j+'"><input id="verified'+j+'" style="font-size:xx-small;" type="checkbox" onclick="handleChange(this)"></td></tr>';
                                }
                            else{
                                x += '<td id="verified'+j+'"><input id="verified'+j+'" style="font-size:xx-small;" type="checkbox" checked onclick="handleChange(this)"></td></tr>';
                            }
                            j++;

                        }

                });//.each
                jQuery_2_2_2('#reportbody').append(x);


                table=jQuery_2_2_2('#reporttable').DataTable({
                    "stateSave": true,
                    checkboxRefresh:true,
                    dom: 'Bfrtip',
                    buttons: [
                        {
                        extend: 'excel',
                        exportOptions: {
                            orthogonal: 'sort'
                        }
                    }        
                ],
                columnDefs: [{
                   targets:[19],
                   render: function(data, type, row, meta){
                      if(type === 'sort'){
                         var $input = $(data).find('input[type="checkbox"]').addBack();
                         data = ($input.prop('checked')) ? "1" : "0";
                      }

                      return data;    
                   }
                }], 
                    scrollY:        true,
                    scrollX:        true,
                    scrollCollapse: true,
                    fixedColumns:   {
                        leftColumns: 1,
                        rightColumns: 1
                    }

                    });//.datatable

            });//.done
    });/
    function handleChange(e){
        $(e).attr('checked', !($(e).attr('checked'))); 
    }



Aucun commentaire:

Enregistrer un commentaire