Esta es mi colección de cartero que quiero mostrar en mi tabla de datos ajax. Quiero mostrar algunos datos seleccionados de él. Obtengo estos datos en mi respuesta ajax pero no puedo mostrarlos en mi tabla. Mi código ajax es este.
"doc":[ {
"billingDate": "2022-04-11T11:54:16.600Z",
"_id": "6256ce0404de4671d565cca6",
"serviceProvider": {
"blocked": false,
"isLoggedIn": true,
"createdDate": "2022-04-03T20:04:52.082Z",
"_id": "624a01981399dc7a14173dda",
"city": "Karachi",
"email": "johndoe1@app.com",
"password": "3460c98eec954a700b17bbac9f14b222",
"providerName": "Test Service",
"address": "123 Street",
"serviceProviderId": "TES321326",
"__v": 0
},
"services": [
{
"_id": "6256ce0404de4671d565cca7",
"serviceName": "husnain",
"actualCost": 60,
"discountedCost": 60
},
{
"_id": "6256ce0404de4671d565cca8",
"serviceName": "husnain",
"actualCost": 60,
"discountedCost": 70
},
{
"_id": "6256ce0404de4671d565cca9",
"serviceName": "husnain",
"actualCost": 60,
"discountedCost": 80
}
],
"total": 210,
"company": {
"blocked": false,
"isLoggedIn": false,
"createdDate": "2022-04-03T12:14:51.356Z",
"_id": "62498fc7acd7fb091185b88d",
"email": "kpetherick3h@live.com",
"companyName": "Yozio",
"address": "1 Buhler Road",
"image": "http://dummyimage.com/327x225.png/dddddd/000000",
"companyId": "UDB21WROMBA8",
"password": "3460c98eec954a700b17bbac9f14b222",
"__v": 0
},
"employee": {
"createdDate": "2022-04-03T17:09:47.994Z",
"enabled": true,
"_id": "6249d52bfef2560326a740e7",
"fName": "James Bartley",
"age": 30,
"CNIC": "3974224221510",
"spouse": "Hilary",
"fatherName": "James",
"motherName": "Brunhilde",
"employeeImage": "http://dummyimage.com/267x237.png/ff4444/ffffff",
"employeeID": "YO550717",
"company": "62498fc7acd7fb091185b88d",
"children": [],
"__v": 0
},
"billId": "YOTE529822",
"__v": 0
},
]
Quiero mostrar el nombre del empleado, la identificación del empleado, el objeto de matriz de servicios. Recibo estos datos en respuesta, pero no puedo mostrarlos en mi tabla de datos. En la función de éxito, estoy tratando de inicializar la tabla de datos y los datos que obtengo en response.doc, tratando de agregarlos a la tabla.
$(document).ready(function() {
$.ajax({
type: "POST",
contentType: "application/json",
url: 'https://2057-185-202-239-227.ngrok.io/serviceprovider/billByServiceProvider',
data: JSON.stringify({
serviceProvider: sessionStorage.getItem("Services_id"),
}),
dataType: "json",
success:function(response){
$('#example12').DataTable({
"ajax": 'response.doc'
});
}
});
});
Solución del problema
https://dotnetfiddle.net/KELuHH
Copié su json en http://json.parser.online.fr/ y para corregir sus errores, envolví el json entre llaves onduladas {} y me deshice de la última coma. Luego usé el bloc de notas ++ para reemplazar las comillas dobles con comillas simples. Debe analizar los datos en filas para que se muestre la tabla de datos.
Controlador/Clases:
public class Output
{
public string Name { get; set; }
public string Id { get; set; }
public string Services { get; set; }
}
public class HomeController: Controller
{
public ActionResult Index17()
{
dynamic json = JsonConvert.DeserializeObject(@"{'doc':[ {
'billingDate': '2022-04-11T11:54:16.600Z',
'_id': '6256ce0404de4671d565cca6',
'serviceProvider': {
'blocked': false,
'isLoggedIn': true,
'createdDate': '2022-04-03T20:04:52.082Z',
'_id': '624a01981399dc7a14173dda',
'city': 'Karachi',
'email': 'johndoe1@app.com',
'password': '3460c98eec954a700b17bbac9f14b222',
'providerName': 'Test Service',
'address': '123 Street',
'serviceProviderId': 'TES321326',
'__v': 0
},
'services': [
{
'_id': '6256ce0404de4671d565cca7',
'serviceName': 'husnain',
'actualCost': 60,
'discountedCost': 60
},
{
'_id': '6256ce0404de4671d565cca8',
'serviceName': 'husnain',
'actualCost': 60,
'discountedCost': 70
},
{
'_id': '6256ce0404de4671d565cca9',
'serviceName': 'husnain',
'actualCost': 60,
'discountedCost': 80
}
],
'total': 210,
'company': {
'blocked': false,
'isLoggedIn': false,
'createdDate': '2022-04-03T12:14:51.356Z',
'_id': '62498fc7acd7fb091185b88d',
'email': 'kpetherick3h@live.com',
'companyName': 'Yozio',
'address': '1 Buhler Road',
'image': 'http://dummyimage.com/327x225.png/dddddd/000000',
'companyId': 'UDB21WROMBA8',
'password': '3460c98eec954a700b17bbac9f14b222',
'__v': 0
},
'employee': {
'createdDate': '2022-04-03T17:09:47.994Z',
'enabled': true,
'_id': '6249d52bfef2560326a740e7',
'fName': 'James Bartley',
'age': 30,
'CNIC': '3974224221510',
'spouse': 'Hilary',
'fatherName': 'James',
'motherName': 'Brunhilde',
'employeeImage': 'http://dummyimage.com/267x237.png/ff4444/ffffff',
'employeeID': 'YO550717',
'company': '62498fc7acd7fb091185b88d',
'children': [],
'__v': 0
},
'billId': 'YOTE529822',
'__v': 0
}
]}");
//get the first
string name = json.doc[0].employee.fName;
string employeeId = json.doc[0].employee.employeeID;
//how many services
int serviceCount = json.doc[0].services.Count;
var services = String.Empty;
for (int i = 0; i < serviceCount; i++)
{
services += "Service" + i.ToString() + Environment.NewLine;
services += "service id: " + json.doc[0].services[i]._id + Environment.NewLine;
services += "serviceName: " + json.doc[0].services[i].serviceName + Environment.NewLine;
services += "actualCost: " + json.doc[0].services[i].actualCost + Environment.NewLine;
services += "discountedCost: " + json.doc[0].services[i].discountedCost + Environment.NewLine;
services += Environment.NewLine;
}
Output output = new Output { Id = employeeId, Name = name, Services = services };
List<Output> list = new List<Output>();
list.Add(output);
var q = Json(list, JsonRequestBehavior.AllowGet);
return q;
}
Vista:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<link href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css" rel="stylesheet" />
<script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
<script>
$(function () {
var table1 = $('#example').DataTable({
"processing": false,
"serverSide": true,
"bProcessing": false,
"ajax": {
"url": "/home/index17",
"contentType": "application/json; charset=utf-8",
"dataType": "json",
"asynch": false,
"success": function (theData) {
var ap = "dh";
var tbody = $('#example tbody')
$.each(theData, function (index, value) {
var row = $("<tr>");
row.append($("<td>").text(value.Id));
row.append($("<td>").text(value.Name));
row.append($("<td>").text(value.Services));
tbody.append(row);
});
}
},
});
});
</script>
</head>
<body>
<table id="example" class="display" style="width:100%">
<thead>
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
No hay comentarios:
Publicar un comentario