Как загрузить данные в сетку Kendo с помощью вызова ajax? ⇐ Jquery

[Anonymous]

Я создаю приложение весенней загрузки для бронирования авиабилетов. Я определил контроллер для получения информации о рейсе из базы данных:

Код: Выделить всё

@Controller
@RequestMapping("/home")
public class FlightController {

@Autowired
private FlightService flightService;

@GetMapping("/search")
public String getFlights(
@RequestParam("origin") String origin,
@RequestParam("destination") String destination,
Model model,
HttpSession session) {

List flightList = flightService.getFightsByOriginAndDestination(origin, destination);

if(flightList.isEmpty()) {
model.addAttribute("message", "No flights available for the given origin and destination.");
return "home";
}
else {
model.addAttribute("flightList", flightList);
model.addAttribute("username", session.getAttribute("username"));
return "home";
}
}
}

Теперь я хочу отобразить детали в сетке кендо, выполнив вызов ajax. Я пробовал что-то подобное, но это не сработало:

Код: Выделить всё

$(document).ready(function () {

$.ajax({
url: "/home/search",
type: "GET",
dataType: "local",

success: function (data) {

$("#grid").kendoGrid({
dataSource: {
data: data,
pageSize: 10
},
height: 550,
sortable: true,
pageable: true,
columns: [
{ field: "flight_Number", title: "Flight Number" },
{ field: "airline_Name", title: "Airline Name" },
{ field: "departure", title: "Departure" },
{ field: "arrival", title: "Arrival" },
{ field: "date", title: "Date" },
{ field: "price", title: "Price" }

]
});
},
error: function (xhr, status, error) {
console.error("Failed to fetch flight data:", error);
}
});
});

Я знаю, что что-то не так, но не могу указать на проблему. Может кто-нибудь помочь?

Подробнее здесь: https://stackoverflow.com/questions/784 ... -ajax-call