2017-03-01 123 views
0

我想在名为factuur的最后一个datarecord上获得一个按钮。我想获得一个div或按钮,但我怎么能在这样的数据数组中做到这一点。 我想我应该在这里增加一个班到TD和替换文本像这样的东西:如何添加一个类到json数据表?

$('.className').each(function(index, item){ 
    $(item).html(yourButton html); 
}) 

有人知道如何做到这一点还是一个更好的方式来做到这一点? I looked into this,但无法弄清楚如何申请是在我的JSON。

这是我的脚本看起来像现在:

<table id="oTable" border="1" class="table_tag"> 

    <tr><thead> 
    <th>Ordernummer</th> 
    <th>Besteldatum</th> 
    <th>BTW</th> 
    <th>Totaalbedrag</th> 
    <th>Status</th> 
    <th>Verzonden</th> 
    <th>Factuur</th> 
    </thead></tr> 
</table> 

脚本:

$(function(){ 
    // Basic Setup 
    var $tableSel = $('#oTable'); 
    $tableSel.dataTable({ 
    'aaData': data, 
    'aoColumns': [ 
     {'mData': 'EAN'}, 
     {'mData': 'Besteldatum'}, 
     {'mData': 'BTW'}, 
     {'mData': 'Totaalbedrag'}, 
     {'mData': 'Status'}, 
     {'mData': 'Verzonden'}, 
     {'mData': 'Factuur'} 
    ], 
    'sDom': '' 
    }); 

    $('#filter').on('click', function(e){ 
    e.preventDefault(); 
    var startDate = $('#start').val(), 
     endDate = $('#end').val(); 

    filterByDate(1, startDate, endDate); 

    $tableSel.dataTable().fnDraw(); 
    }); 

    // Clear the filter. Unlike normal filters in Datatables, 
    // custom filters need to be removed from the afnFiltering array. 
    $('#clearFilter').on('click', function(e){ 
    e.preventDefault(); 
    $.fn.dataTableExt.afnFiltering.length = 0; 
    $tableSel.dataTable().fnDraw(); 
    }); 

}); 

/* Our main filter function 
* We pass the column location, the start date, and the end date 
*/ 
var filterByDate = function(column, startDate, endDate) { 
    // Custom filter syntax requires pushing the new filter to the global filter array 
     $.fn.dataTableExt.afnFiltering.push(
      function(oSettings, aData, iDataIndex) { 
       var rowDate = normalizeDate(aData[column]), 
       start = normalizeDate(startDate), 
       end = normalizeDate(endDate); 

      // If our date from the row is between the start and end 
      if (start <= rowDate && rowDate <= end) { 
      return true; 
      } else if (rowDate >= start && end === '' && start !== ''){ 
      return true; 
      } else if (rowDate <= end && start === '' && end !== ''){ 
      return true; 
      } else { 
      return false; 
      } 
     } 
     ); 
    }; 

// converts date strings to a Date object, then normalized into a YYYYMMMDD format (ex: 20131220). Makes comparing dates easier. ex: 20131220 > 20121220 
var normalizeDate = function(dateString) { 
    var date = new Date(dateString); 
    var normalized = date.getFullYear() + '' + (("0" + (date.getMonth() + 1)).slice(-2)) + '' + ("0" + date.getDate()).slice(-2); 
    return normalized; 
} 
var data = [ 
     { 
      "EAN": "180199", 
      "Besteldatum": "2003-09-22", 
      "BTW": "€19,00", 
      "Totaalbedrag": "€109,00", 
      "Status": "Verzonden", 
      "Verzonden": "2003-09-22", 
      "Factuur": "here" 

     }, 
     { 
      "EAN": "180200", 
      "Besteldatum": "2004-11-12", 
      "BTW": "€19,00", 
      "Totaalbedrag": "€109,00", 
      "Status": "Verzonden", 
      "Verzonden": "2003-09-22", 
      "Factuur": "here" 
     }, 

    ]; 
+0

您可以将类添加到“aoColumns”中的“sclass”属性的列中http://legacy.datatables.net/usage/columns –

回答

0

什么每个TR的最后一个子选择?

$('tr:last-child').each(()=>{ 
    $(this).append("<button>"); 
}) 
相关问题