I have an issue with trying to delete row Server-side

forte

I would like to delete the row from the Server-side and can't find the way to do that, looking for some help... I try this code below but I'm getting a ReferenceError: ds is not defined in the console and I'm not sure how to fix that... need little help..

var deleteTable = $('#example').DataTable({
  "paging": true,
  "ordering": true,
  "info": true,
  "pageLength": 15,
  "fixedHeader": true,
  "data": ds,
  columns: [
    { data: 'First_Name' },
    { data: 'Last_Name' },
    { data: 'Street' },
    { data: 'City' },
    { data: 'State' },
    { data: 'Zip' },
    { data: 'Phone' },
    { data: 'Emailid' }
     ],
});

$('#example').on('click', function(e) {
  var row = $(e.currentTarget).closest("tr");
  var data = $('#example').dataTable().fnGetData(row);

  var deleteUrl = 'the url to the databank'

  $.ajax({
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify(json),
    url: deleteUrl,
    success: function(json) {
      if(json && json.sucess) {
        $('#example').dataTable().fnDeleteRow(row);
      }
    },
    error: function(textStatus, errorThrown) {
      console.log(errorThrown);
    }
  });
});

colin

Hi @forte,

The only place ds is referenced if when you're defining your data:

  "data": ds,

So, has ds been initialised? Is it in the scope of this code?

Cheers,

Colin

forte

Ok, here's what I have from the top...

Now what I would like to do is get information from an outside server using an URL. That is working fine which is the top part of this code...

The 2nd part of this code starting here : " $('#example').on('click', function(e){ "...

What I would like to do is to delete the clicked row and delete on the server-side and I was looking for some help with that..

Right now when I click on the row, nothing happens and the console gives me a Cross-Origin Request Blocked: "error" Reason: CORS header ‘Access-Control-Allow-Origin’ missing.

Not sure how to fix this...

$(document).ready(function(){
        
    var URL = //here is were I put the URL to the server'

var table;
        table = $('#example').DataTable( {
        processing: true,
        severSide: true,
        autoWidth: false,
        responsive: true,
        searching: true,
        lengthMenu: [ [25, 50, 100], [25, 50, 100] ],
        ajax: {
                url: URL,
                type: "GET",
                crossDomain: true,
                dataType: "jsonp",
                dataSrc: 'Seller_Leads_Information'
                },
    
            columns : [
                {data: 'First_Name'},
                {data: 'Last_Name'},
                {data: 'Street'},
                {data: 'City'},
                {data: 'State'},
                {data: 'Zip'},
                {data: 'Phone'},
                {data: 'Emailid'}
            ],
            columnDefs: [{
                    "targets": [ 0 ],
                    "render": function ( data, type, row ) {
                            return data +'  '+ row.Last_Name +' ' ;
                        }
                        },
                        {
                        "targets": [ 2 ],
                        "render": function ( data, type, row ) {
            return  row.Street +' '+ row.City +' '+ row.State+' '+ row.Zip;
        }   
                        },
                        {
                        "targets": [ 6 ],
                        "render": function ( toFormat  ) {
                            var tPhone;
                                tPhone=toFormat.toString();            
                                tPhone='(' + tPhone.substring(0,3) + ')' + tPhone.substring(3,6) + '-' + tPhone.substring(6,10);   
                                return tPhone }
        },
                        {"visible": false,  
                        "targets": [ 1, 3, 4, 5]
                        }]

    });      
         
     $('#example').on('click', function(e){ 
            var row = $(e.currentTarget).closest("tr");
            var data = $('#example').dataTable().fnGetData(row);
            
            var deleteUrl = 'here is were I POST to the URL to the server to delete clicked row'
            
            $.ajax({
                url: deleteUrl,
                type: 'POST',
                crossDomain: true,
                dataType: "json",
                data: JSON.stringify(),
                
                success: function(json){
                    if(json && json.sucess){
                    $('#example').dataTable().fnDeleteRow(row);
                    }
                },
                error: function (textStatus, errorThrown) {
            console.log(errorThrown);
        }
    });
     });
 });

colin

That's nothing to do with DataTables, that's just standard security when you try to access another domain's resource. The best bet is to look google for it, there's various mentions of it, such as this link.