how to set server-side processing on dynamically created tables?

how to set server-side processing on dynamically created tables?

kgeffertkgeffert Posts: 3Questions: 2Answers: 0

One of the requirements for my project is to allow user to display data from tables with different structures/columns in the same datatables implementation. The user selects a report they wish to review, and datatables is drawn based on the columns in the associated Oracle table. I can not hardcode the datatables initializaion because new reports will be rolled out over time and I do dno know what the structure will be until I create it in the backend server table. I have successfully implemented this using ajax, json and the following code which is run when user selects a report:

$( document ).ready( function( $ ) {
           $.ajax({
                   "url": "./getDataServletstudy=16244&repname="+reportname,
                   "success": function(json) {      
                       var tableHeaders;
                       $.each(json.columns, function(i, val){
                           tableHeaders += "<th>" + val + "</th>";
                       });
                         
                       $("#tableDiv").empty();
                       $("#tableDiv").append('<table id="example" class="display" cellspacing="0" width="100%"><thead><tr>' + tableHeaders + '</tr></thead></table>');
                        
                       
                       $('#example').dataTable(json);
                   },
                   "dataType": "json"
               });
        });

Now I find I need to use server-side processing because the data in the reports are exceeding greater than 20k records and are "fat"--36 to 56 columns I can no longer get the above to execute once the records exceed 1000. my JSon response (for only 2 records is like the following. How do I implement dynamic tables with server-side processing?

{"columns": [[ "Row-Select" ],[ "Lock" ],[ "ACTION_TO" ],[ "RC_LABEL" ],[ "STUDY" ],[ "DM_COMMENT" ],[ "EXT_COMMENT" ],[ "QUERY_TEXT" ],[ "QRYINRAVE" ],["CHECKBOX"],[ "SUBJECTID" ],[ "VISIT" ],[ "PLANNED_TIME" ],[ "RAVE_SPECIMEN_TYPE" ],[ "RAVE_SAMPLE_NOT_DONE" ],[ "RAVE_DATE" ],[ "EXTERNAL_DATE" ],[ "EXTERNAL_TEST" ],[ "EXTERNAL_REFERENCE_ID" ],[ "VISIT_MATCH" ],[ "DATE_MATCH" ],[ "KEY_MATCH" ],[ "RANDOMIZATION_DATE" ],[ "INFORMED_CONSENT_DATE" ],[ "IC_WITHDRAWAL_DATE" ],[ "OBJECTION_TO_FURTHER_DATA_DATE" ],[ "CWID" ],[ "DATE_MOD" ],[ "MSGVARS" ],[ "QRYSTATUS" ],[ "QRYRESPONSE" ],[ "LINKURL" ],[ "RAVE_RECORDID" ],[ "QUERYID" ],[ "NEW" ],[ "ID" ],[ "CHANGED" ],[ "WHATCHANGED" ],[ "Updated" ]],  "data": [["","","","Lab","16244","","","","N","<input type='checkbox' id='chk0' class='RaveQuery' onchange='setQList(this)'>","410096019","RUN IN","","Urine","","2/7/2016","2/7/2016","","","Yes","Yes","Yes","3/15/2016","","","","ERKAH","2016/09/16 02:15:22 AM","RUNIN|LB_HL_EXT_URINE|07-FEB-16|2","","","<a href='https://BHC1.mdsol.com/MedidataRave/SelectRole.aspx?page=CrfPage.aspx&DP=0' target='_blank'>link to Rave</a>","","","","197","","",""],["","","","Lab","16244","","","","N","<input type='checkbox' id='chk1' class='RaveQuery' onchange='setQList(this)'>","410096027","SCREENING VISIT","","Urine","","5/3/2016","5/3/2016","","","Yes","Yes","Yes","5/12/2016","","","","","","SCN|LB_HL_EXT_URINE|03-MAY-16|1","","","<a href='https://BHC1.mdsol.com/MedidataRave/SelectRole.aspx?page=CrfPage.aspx&DP=0' target='_blank'>link to Rave</a>","","","","198","","",""]] }

This question has an accepted answers - jump to answer

Answers

  • kgeffertkgeffert Posts: 3Questions: 2Answers: 0

    I think I can answer my own question, at least this seems to work, the table is initialized and data loads. I don't have the server side implemented but there are plenty of examples around, so I should be able to get it working. In any case, here is what I changed in the javascript:
    ```
    $( document ).ready( function( $ ) {
    $.ajax({
    "url": "./reconReportsServlet?study=16244&repname=Lab",
    "success": function(json) {
    var tableHeaders;
    $.each(json.columns, function(i, val){
    tableHeaders += "<th>" + val + "</th>";
    });

                       $("#tableDiv").empty();
                       $("#tableDiv").append('<table id="example" class="display" cellspacing="0" width="100%"><thead><tr>' + tableHeaders + '</tr></thead></table>');
    
    
               **       $('#example').dataTable({
                           serverside: false,
                           processing:true,
                          data:   json.data,
                       });
    
                   },
                   "dataType": "json"
               });**
    

    I'm using datatables 1.10. I have seen the attributes different ways on this site. is it "bServerSide": or serverside, and is it in quotes or not?

  • allanallan Posts: 63,352Questions: 1Answers: 10,443 Site admin
    Answer ✓

    is it "bServerSide": or serverside, and is it in quotes or not?

    serverSide. The bServerSide styling is legacy (although it will work). There is no such thing as serverside.

    The full list of options are available here.

    Allan

This discussion has been closed.