1

I add select dropdown in DOM of angular-datatable existing in github Click here for Referecnce

app.controller('dataTableCrtl', dataTableFunction);

app.js

function dataTableFunction($scope, $state, DTOptionsBuilder, DTColumnBuilder, $timeout) {
  var campoAno = angular.element( document.querySelector( '.contentano' ) );
  campoAno.prepend('<select class="form-control item-acoes" name="exercicio" id="selectano"><option value='2015'>2015<option><option value='2016'>2016<option></select>
  var vm = this;
  vm.dtInstance = {};
  vm.dtOptions = DTOptionsBuilder.newOptions()
  .withOption('ajax', {
     url : url+'dt_docs.php',
     type : 'GET',
     contentType : 'application/json'
  })
  .withDataProp('aaData')
  .withOption('processing', true)
  .withOption('serverSide', true)
  .withOption('order', [0, 'desc'])
  .withDOM("<'row hidden-print'<'col-sm-6'l><'col-sm-6 contentano divbusca'f>><'row'<'col-sm-12'tr>><'row form-actions hidden-print'<'col-sm-6'i><'col-sm-6'p>>")

  function changeAno() {
    $('#selectano').bind('change', function(){
      vm.dtInstance.reloadData();
    });
  }
}

page.html

<table datatable="" class="table table-condensed table-hover" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" dt-instance="showCase.dtInstance" class="row-border hover" width="100%"></table>

result

enter image description here

I'm try change select and send data of option selected and reload or refresh the Datatble angular. But don't reload or refresh my page on select dropdown of year.

2
  • Syntax error: vm.dtInstance = {}; .withOption('ajax', {
    – C14L
    Commented May 27, 2016 at 15:12
  • Ok thanks for this, I forgot when i copy the code. But my ask is for solve other problem. refresh datatable on change option in select Commented May 30, 2016 at 19:50

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.