tengo problemas con el plugin de dataTable el cual no me muestra los datos que llamo por webservice.
$(document).ready(function() {
var tBusqueda = $("#selectTipoBusqueda option:selected").text();
var tProyecto = $("#selectTipoProyecto option:selected").text();
var txbBusqueda = $('#txbBuscar').val();
var jsonValid;
$.ajax({
type: 'POST',
dataType: 'json',
contentType: 'application/json; charset=utf-8',
url: '<%=ResolveUrl("~/Default.aspx/mostrarGrilla" ) %>',
data: "{'tipoBusqueda':'" + tBusqueda + "', 'tipoProyecto':'" + tProyecto + "', 'txbBuscar':'" + txbBusqueda + "'}",
success: function(data) {
var datatableVariable = $('#dataTable').DataTable({
// "destroy" : true,
// "processing" : true,
// "serverSide" : true,
// dom: 'Bfrtip',
// obs : data['d'] ,
// dataSrc: 'obs',
// mData: 'obs',
// responsive: true,
select: true,
"columns": [{
data: "data.n"
},
{
data: "data.p"
},
{
data: "data.e"
},
{
data: "data.h"
},
{
data: "data.fi"
},
{
data: "data.s"
},
{
data: "data.d"
},
{
data: "data.fa"
},
{
data: "data.ra"
},
{
data: "data.pro"
}
],
language: {
"decimal": ".",
"emptyTable": "No se ha llamado información o no está disponible",
"infoEmpty": "Sin registros",
"infoFiltered": "(Filtrado de _MAX_ total entradas)",
"lengthMenu": "Mostrar _MENU_ entradas",
"loadingRecords": "Cargando...",
"processing": "Procesando",
"search": "Buscar: ",
"zeroRecords": "No se encuentran resultados",
"paginate": {
"first": "Primero",
"last": "Último",
"next": "Siguiente",
"previous": "Anterior"
}
}
});
$('#dataTable tfoot th').each(function() {
var placeHolderTitle = $('#dataTable thead th').eq($(this).index()).text();
$(this).html('<input type="text" class="form-control input input-sm" placeholder = "Buscar ' + placeHolderTitle + '" />');
});
datatableVariable.columns().every(function() {
var column = this;
$(this.footer()).find('input').on('keyup change', function() {
column.search(this.value).draw();
});
});
$('.showHide').on('click', function() {
var tableColumn = datatableVariable.column($(this).attr('data-columnindex'));
tableColumn.visible(!tableColumn.visible());
});
},
error: function(result) {
alert("error");
}
});
});
<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table table-bordered" id="dataTable" name="dataTable">
<thead>
<tr>
<th>N° Obs</th>
<th>Prioridad</th>
<th>Estado</th>
<th>Hoja</th>
<th>Fecha inicial</th>
<th>Solicitante</th>
<th>Descripción</th>
<th>Última modificación</th>
<th>Responsable</th>
<th>Proyecto</th>
</tr>
</thead>
<tfoot>
<tr>
<th>N° Obs</th>
<th>Prioridad</th>
<th>Estado</th>
<th>Hoja</th>
<th>Fecha inicial</th>
<th>Solicitante</th>
<th>Descripción</th>
<th>Última modificación</th>
<th>Responsable</th>
<th>Proyecto</th>
</tr>
</tfoot>
</table>
El WebMethod que utilizo es el siguiente:
<WebMethod()> Public Shared Function mostrarGrilla(ByVal tipoBusqueda As String, ByVal tipoProyecto As String, ByVal txbBuscar As String)
Using cn As New conexion
Using cmd As New Npgsql.NpgsqlCommand
cn.Conectar()
Dim txtSELECT As String = "SELECT numero as N,prioridad as P, e_estado as E, aoi as H, f_ingreso as FI, solicitante as S, descripcion as D, f_actual as FA, r_actual as RA, proyecto as PRO"
Dim txtFROM As String = " FROM sistema.observaciones.vista_completa_observaciones WHERE numero in (1500,2000) "
Dim txtORDER As String = " ORDER BY numero DESC "
cmd.CommandText = (txtSELECT + txtFROM + txtORDER)
cmd.Connection = cn.conexion
Dim ds As New DataSet()
Dim dt As New DataTable
Using sda As New NpgsqlDataAdapter(cmd)
sda.Fill(ds, "data")
Dim json As String = JsonConvert.SerializeObject(ds, Newtonsoft.Json.Formatting.Indented)
Return json
End Using
End Using
End Using
End Function
La data que me trae mi consulta tiene el siguiente formato (notese que tiene una "d:" antes):
{"d":"{\r\n \"data\": [\r\n {\r\n \"n\": 2000,\r\n \"p\": 2017,\r\n \"e\": \"Finalizada \",\r\n \"h\": \"C069\",\r\n \"fi\": \"2016-05-25T12:40:59\",\r\n \"s\": \"Cecilia Sandoval \",\r\n \"d\": \"Se solicita a la seccion publicaciones , realizar correccion de observaciones encontradas en proceso de revision.\",\r\n \"fa\": \"2016-06-22T16:35:12\",\r\n \"ra\": \"Valeria Sandoval \",\r\n \"pro\": \"Publicación \"\r\n },\r\n {\r\n \"n\": 1500,\r\n \"p\": 2017,\r\n \"e\": \"Finalizada \",\r\n \"h\": \"J011\",\r\n \"fi\": \"2014-02-20T12:01:31\",\r\n \"s\": \"Valeria Sandoval \",\r\n \"d\": \"Se solicita unir la feature que curresponde al lago con la feature curagua_L representado en la Imagen 1, ya que tienen una pequeña separación.\",\r\n \"fa\": \"2014-02-25T13:46:36\",\r\n \"ra\": \"Valeria Sandoval \",\r\n \"pro\": \"Publicación \"\r\n }\r\n ]\r\n}"}
Que vista mas ordenadamente es básicamente esto:
Por favor estimados necesito su ayuda! Gracias de antemano.