Невозможно перечислить столбец из таблицы внешнего ключа в JS Datatable - PullRequest
0 голосов
/ 21 июня 2020

У меня в заявке стоит следующая модель. Когда я пытаюсь перечислить запись из таблицы внешних ключей vehiclestatus, в таблице данных отображается ошибка в строке vehicleStatus.status в моем javascript файле. Как я могу показать статус автомобиля из таблицы внешних ключей Vehiclestatus в таблице данных

 public class VehicleType
{
    [Key]
    public int Id { get; set; }
    [Required]
    public string Category { get; set; }
}
   public class VehicleStatus
{
    [Key]
    public int Id { get; set; }
    [Required]
    public string Status { get; set; }
    
}
 public class Vehicles
{
    [Key]
    public int Id { get; set; }
    [Required]
    public string Make { get; set; }
    [Required]
    public string Model { get; set; }
    [Required]
    public string RegNo { get; set; }
    [Required]
    public string VehicleName {get;set;}
    public DateTime? MOTDate { get; set; }       
    public DateTime? TaxDate { get; set; }
    public DateTime? RegDate { get; set; }
    public DateTime? InsuredDate { get; set; }
    public string Comment { get; set; }
    [Required]
    public bool IsDeleted { get; set; } = false;
    [Required]
    public int VehicleStatusId { get; set; }
    [ForeignKey("VehicleStatusId")]
    public VehicleStatus VehicleStatus { get; set; }
    public int VehicleTypeId { get; set; }
    [ForeignKey("VehicleTypeId")]
    public VehicleType VehicleType { get; set; } 
}

Контроллер

 public IActionResult GetAll()
    {
        var allObj = _unitOfWork.VehicleRepo.GetAll(v=>v.IsDeleted==false,includeProperties: "VehicleStatus,VehicleType");
        return Json(new { data = allObj });
    }

Просмотр и Javascript файл

 var dataTable;



    $(document).ready(function () {
        loadDataTable();
    });


    function loadDataTable() {
        var dataTable = $('#tblData').DataTable({
            "ajax": {
                "url": "/Vehicle/GetAll",
                "success": function (data) {
                    console.log(data);
                }
            },
            "columns": [
                { "data": "regNo" },
                { "data": "make" },
                { "data": "model" },               
                { "data": "vehicleStatus.status"},
                { "data": "vehicleName" },
                { "data": "motDateString" },
                { "data": "taxDateString" },
                { "data": "regDateString" },
                { "data": "insuredDateString" },
                { "data": "motDate" },
                { "data": "taxDate" },
                { "data": "regDate" },
                { "data": "insuredDate" },
                {
                    "data": "id",
                    "render": function (data) {
                        return `
                                <div class="text-center">
                                    <a href="/Vehicle/UpsertVehicle/${data}" class="btn btn-success text-white" style="cursor:pointer">
                                        <i class="fas fa-edit"></i> 
                                    </a>
                                    <a onclick=Delete("/Vehicle/Delete/${data}") class="btn btn-danger text-white" style="cursor:pointer">
                                        <i class="fas fa-trash-alt"></i> 
                                    </a>
                                </div>
                               `;
                    }, "width": "12%"
                }
            ],
            columnDefs: [
                {
                        "className": "dt-center", "targets": "_all" 
                }
            ],
            scrollY: "600px",
            scrollX: true,
            paging: false,
            dom: 'Bfrtip',
            buttons: [
                'copy',
                'csv',
                'excel',
                {
                    extend: 'pdfHtml5',
                    orientation: 'landscape',
                    pageSize: 'LEGAL'
                }

            ]


        });
       
    }
 <div class="row">
                <div class="table-responsive">
                    <table id="tblData" class="table table-bordered" style="width:100%;font-size:90%">
                        <thead class="thead-light">
                            <tr>
                                <th>Registration No</th>
                                <th>Reg Date</th>
                                <th>Make</th>
                                <th>Model</th>    
                                <th>status</th>
                                <th>Description</th>
                                <th>MOT Date</th>
                                <th>TaxDate</th>
                                <th>Insurance<br /> Renewal <br /> Date</th>
                                <th>MOT</th>
                                <th>Tax</th>
                                <th>Reg</th>
                                <th>InsDate</th>
                                <th>Comment</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>

    @section Scripts
    {
        <script src="~/js/VehicleReport.js"></script>
    }
...