AnsweredAssumed Answered

Datatable JQuery plugin zoom to selected rows onclick

Question asked by AlexSabrina on Nov 17, 2015
Latest reply on Nov 17, 2015 by AlexSabrina

Hi all,

I am trying to figure out how to zoom to a feature when a datatable row is clicked on. Just like this but using datatables instead of GRID dojo.

Any ideas or recommendations would be helpful

 

 

My query  my table are fed as such:

function addToMap3(results) {
                             map.graphics.clear();
                             var featureArray = results.features;
                             if (featureArray && featureArray.length > 0) {
                                 // do stuff with the features
                                 arrayUtils.forEach(featureArray, function (feat) {
                                     feat.setSymbol(symbol8);
                                     map.graphics.add(feat);
                                 });
                                 var extent = esri.graphicsExtent(map.graphics.graphics);
                                 map.setExtent(extent, true);


                                 var cols = [],
                                 row = [],
                                 data = [];
                                 var selected = [];


                                 //create columns
                                 $.each(results.fields, function (index, value) {
                                     cols.push({ 'sTitle': value.name });
                                 });


                                 //create columns
                                 //create rows and push into data
                                 $.each(results.features, function (index, value) {


                                     row = [];
                                     $.each(value.attributes, function (index2, value2) {
                                         row.push(value2);
                                     });
                                     data.push(dojo.clone(row));
                                 });




                                 $('#example').dataTable({
                                     dom: 'Bfrtip',
                                     data: data,
                                     columns: cols,
                                     destroy: true,
                                     buttons: [
                                        'copy', 'csv', 'excel', 'pdf', 'print'
                                     ],
                                     "rowCallback": function (row, data) {
                                         if ($.inArray(data.OBJECTID, selected) !== -1) {
                                             $(row).addClass('selected');
                                         }
                                     }


                                 });
                                 $('#example tbody').on('click', 'td', function () {
                                     alert('Row index: ' + table.row(this).index());;
                                 });


                                    
                                 
                                 


                             } else {
                                 // do stuff when no features were found
                                 alert("No features found")
                             }


                         }

 

 

My code is here.

Thanks,

Alex

Outcomes