Redrawing Tables with javascript Object sources

felixgill

Hello

I have a nice little dataTable where the dataset is sourced up from a View. It works nicely. Beautifully in fact. Kudos to the designer(s).

My issue come when my on("click",function(e){...
does

 $("#useData").on('click',function(e) {
        e.preventDefault();
        dataSet=[];

        var p = checkProps();
        var s = checkStore();

        var c1 = document.getElementById("Open_ChkBx"); 
        var c2 = document.getElementById("Proposed_ChkBx");
        var c3 = document.getElementById("Inactive_ChkBx");
        var c4 = document.getElementById("Closed_ChkBx"); 

        var m = document.getElementById("Complex_ChkBx");

        var oTable = $('#Main_table').DataTable();

        if(p!=null){
            if(c1.checked==true){dataSet.push.apply(dataSet,p.filter(isOpen));}
            if(c2.checked==true){dataSet.push.apply(dataSet,p.filter(isProposed));}
            if(c3.checked==true){dataSet.push.apply(dataSet,p.filter(isInactive));}
            if(c4.checked==true){dataSet.push.apply(dataSet,p.filter(isClosed));}
        }
        
        if(s!=null){
           
                if(c1.checked==true){dataSet.push.apply(dataSet,s.filter(isOpen));}
                if(c2.checked==true){dataSet.push.apply(dataSet,s.filter(isProposed));}
                if(c3.checked==true){dataSet.push.apply(dataSet,s.filter(isInactive));}
                if(c4.checked==true){dataSet.push.apply(dataSet,s.filter(isClosed));}
           
            }
        

        if(m.checked==true){
           
                if(c1.checked==true){dataSet.push.apply(dataSet,dataAllComplex.filter(isOpen));}
                if(c2.checked==true){dataSet.push.apply(dataSet,dataAllComplex.filter(isProposed));}
                if(c3.checked==true){dataSet.push.apply(dataSet,dataAllComplex.filter(isInactive));}
                if(c4.checked==true){dataSet.push.apply(dataSet,dataAllComplex.filter(isClosed));}
           
        }
        
        //oTable.clear();
       
        oTTable.data=dataSet;
        oTTable.clear;
        oTable.draw();
       

    })

anythoughts as to why this might not work??

btw

 var oTTable = $('#Main_table').dataTable({
        "data":dataSet,
        "dom": 'RT<"toolbar">lfr<"reset-button"><>t<>ip',
        "oColReorder": {},
        "bProcessing":true,
        "tableTools": {
            "aButtons": [

                {
                    sExtends: "xls",
                    "oSelectorOpts": {
                        page: 'current'
                    },
                    "mColumns": "visible"
                },
                {
                    "sExtends": "pdf",
                    "sPdfOrientation": "landscape",
                    "oSelectorOpts": {
                        page: 'current'
                    },
                    "mColumns": "visible",
                    "sPdfSize": "letter"

                },
                "print"
            ]
        }, ........ }).yadcf([.......]);

felixgill

I am trying to change the dataSet used to draw the table.... no clue how to do this

allan

oTTable.data

There is no data property. There is a data() method, but that is currently for reading data only. It sounds like you might want to use clear() and rows.add():

oTTable
  .clear()
  .rows.add( data )
  .draw();

Allan

felixgill

Hey allan....

two things --- one the rows.add(data) works great...

however the .clear function does not actually clear the table of data. Because the datasets I am loading have overlap I can see the new dataset in my browsers debugger and its 'clean' no duplicates... but after .clear.rows.add(data).draw(); There are all the rows from the previous dataSet.

What is the function to clear all data from the table?

felixgill

I'm silly you are smart... I was doing something wierd with .dataTables vs .DataTables and confused myself.... works great. Thanks