如何使用jQuery触发数据表中的选择事件

时间:2019-05-14 20:48:40

标签: datatables

我已经以编程方式创建了一个数据表。填充记录后,我想对select事件进行某些操作。

我尝试了各种搜索引擎并尝试了所有建议,但无法使其正常工作。

if ( $.fn.DataTable.isDataTable('#customdatatable') ) {
$(document).ready(function() {
var table = $('#customdatatable').DataTable();

$('#customdatatable tbody').on( 'click', 'tr', function () {
    if ( $(this).hasClass('selected') ) {
        $(this).removeClass('selected');
    }
    else {
        table.$('tr.selected').removeClass('selected');
        $(this).addClass('selected');
    }
} );

$('#button').click( function () {
    table.row('.selected').remove().draw( false );
} );

}); }

我正在用html创建这样的表

function CreateTableFromJSON() {
if ( $.fn.DataTable.isDataTable('#customdatatable') ) {
$('#customdatatable').DataTable().destroy();
$('#customdatatable').empty();
}

// Get the data in Json format, Change the URL as per your need.
var entityName ="contact";    // This is the Entity name of Case.
var  url = window.parent.Xrm.Page.context.getClientUrl() + "/api/data/v8.2/" 
+ entityName +"s?$select=firstname,lastname,contactid";      
var myData = []; 
var req = new XMLHttpRequest();
req.open("GET",url, true);
req.setRequestHeader("OData-MaxVersion", "4.0");


 req.setRequestHeader("OData-Version", "4.0");
  req.setRequestHeader("Accept", "application/json");
  req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
  req.setRequestHeader("Prefer", "odata.include-annotations=\"*\"");
  req.onreadystatechange = function() {
   if (this.readyState === 4) {
    req.onreadystatechange = null;
    if (this.status === 200) {    
       myData = JSON.parse(this.response); 
       dataSet=myData.value;     
    } else {
     Xrm.Utility.alertDialog(this.statusText);
    }
   }

   // Convert Json data into 2-d Array
    arrItems = [];    
  $.each(dataSet, function (index, value) {  
   arrItems.push(value.firstname);
   arrItems.push(value.lastname);
   arrItems.push(value.contactid);   
//   arrItems.push(value["prioritycode@OData.Community.Display.V1.FormattedValue"]) ;  // For OptionSet value    
   arrData.push(arrItems);   // Push The Values Inside the Array to Create 2-D Array
   arrItems = [];          
  });

  table(); // Call a table function to create table.  
}
 req.send(); 
 function table() { 
 var test = $.fn.DataTable.isDataTable('#customdatatable');
 if ( $.fn.DataTable.isDataTable('#customdatatable') != true ) {
 $('#customdatatable').DataTable( {
        data: arrData,
        columns: [
            { title: "First Name" },  // Change the column name as per your need.
   { title: "Last Name" },
   { title: "Contact Id" }          
        ],
        select: true,
         select: {
            style: 'single'
        },
        dom: 'Bfrtip',
        buttons: [
        {
         extend: 'excel',
         text: 'Export',
         title: 'Data Export'
         },
         {
         extend: 'print',
         title: 'Customer Data'
         }
        ]

    } );
}

}


}

预期结果将能够调试选择事件。

0 个答案:

没有答案