Ajax вызывает успешно, но данные из веб-API не определены

Question

Я не могу понять, почему мои вызовы ajax продолжают отображаться неопределенными только для этого вызова, но во всех других моих кодах он работает нормально.

Вот что я получаю:

Вот что я получаю при поиске по ID:

вот мой код для моего AJAX:

$("#btnGetTaxByBL").click(function () {
            var strURL = "https://localhost:44395/api/ServiceDeed/GetByBlockNLot/" + blockNo + "/" + lotNo;

            $("#display").html("");
            $("#msg").html("");
            $("#update").html("");
            $("#updateResult").html("");

            console.log("btnGetTaxByBL clicked");

            var blockNo = $("#txtBlockNo").val();
            var lotNo = $("#txtLotNo").val();

            $.ajax({
                type: "GET",
                url: strURL,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    var owner = data;

                    $("#display").html("<hr><p>".concat("HomeOwnerID: ", owner.HomeOwnerID,
                        "<br>FirstName: ", owner.FirstName, "<br>LastName: ", owner.LastName,
                        "<br>Address: ", owner.Address, "<br>City: ", owner.City,
                        "<br>State: ", owner.State, "<br>ZipCode: ", owner.ZipCode,
                        "<br>Telephone Number: ", owner.TelNo, "<br>Email: ", owner.Email,
                        "<br>Block Number: ", owner.BlockNo, "<br>Lot Number: ", owner.LotNo,
                        "<br>Date of Sale: ", owner.SaleDate, "<br>Sale Price: $", owner.SalePrice,
                        "<br>Sold Status: ", owner.IsSold, "<br>Accessed Value: ", owner.AccessedVal,
                        "<br>Land Value: ", owner.LandVal, "<br>Additional Value: ", owner.AdditionalVal,
                        "<br>Tax Rate: ", owner.TaxRate, "<br>Tax Per Year: ", owner.TaxPerYear,
                        "<br>Real Estate Tax: ", owner.RealEstateTax));

                },
                error: function (req, status, error) {
                    alert("Error: " + req.responseText + " | " + status + " | " + error);
                }
            }); //end of ajax method
        }); // end of btnGetTaxByBL click event

Вот код для моего контроллера:

[HttpGet("GetByBlockNLot/{block}/{lot}")]
    public List<HomeTax> GetByBlockNLot(int block, int lot)
    {
        List<HomeTax> homeTaxList = new List<HomeTax>();
        DBConnect objDB = new DBConnect();
        String strSQL = "SELECT * FROM HomeOwnership_T INNER JOIN TaxInfo_T ON HomeOwnership_T.HomeOwnerID=TaxInfo_T.HomeOwnerID WHERE BlockNo =" + block + " AND LotNo =" + lot;
        int count = 0;

        objDB.GetDataSet(strSQL, out count);

        for (int i = 0; i < count; i++)
        {
            HomeTax objOwner = new HomeTax();
            objOwner.HomeOwnerID = (int)objDB.GetField("HomeOwnerID", i);
            objOwner.FirstName = (string)objDB.GetField("FirstName", i);
            objOwner.LastName = (string)objDB.GetField("LastName", i);
            objOwner.Address = (string)objDB.GetField("Address", i);
            objOwner.City = (string)objDB.GetField("City", i);
            objOwner.State = (string)objDB.GetField("State", i);
            objOwner.ZipCode = (string)objDB.GetField("ZipCode", i);
            objOwner.TelNo = (string)objDB.GetField("TelNo", i);
            objOwner.Email = (string)objDB.GetField("Email", i);
            objOwner.BlockNo = (int)objDB.GetField("BlockNo", i);
            objOwner.LotNo = (int)objDB.GetField("LotNo", i);
            objOwner.SaleDate = (DateTime)objDB.GetField("SaleDate", i);
            objOwner.SalePrice = (Decimal)objDB.GetField("SalePrice", i);
            objOwner.IsSold = (string)objDB.GetField("IsSold", i);
            objOwner.AccessedVal = (Decimal)objDB.GetField("AccessedVal", i);
            objOwner.LandVal = (Decimal)objDB.GetField("LandVal", i);
            objOwner.AdditionalVal = (Decimal)objDB.GetField("AdditionalVal", i);
            objOwner.TaxRate = (Decimal)objDB.GetField("TaxRate", i);
            objOwner.TaxPerYear = (Decimal)objDB.GetField("TaxPerYear", i);
            objOwner.RealEstateTax = (Decimal)objDB.GetField("RealEstateTax", i);

            homeTaxList.Add(objOwner);
        }
        return homeTaxList;
    }

Answer 1

Вот ваша проблема

Вы используете blockNo и lotNo в strURL, прежде чем им будет присвоено значение

$("#btnGetTaxByBL").click(function () {
    var strURL = "https://localhost:44395/api/ServiceDeed/GetByBlockNLot/" + blockNo + "/" + lotNo;
    // at this point, blockNo and lotNo are "undefined
        $("#display").html("");
        $("#msg").html("");
        $("#update").html("");
        $("#updateResult").html("");

        console.log("btnGetTaxByBL clicked");

        var blockNo = $("#txtBlockNo").val();
        var lotNo = $("#txtLotNo").val();

просто измените код, чтобы получить blockNo и lotNo ПЕРЕД использованием их в strUrl исправит первую проблему

$("#btnGetTaxByBL").click(function () {
    var blockNo = $("#txtBlockNo").val();
    var lotNo = $("#txtLotNo").val();
    var strURL = "https://localhost:44395/api/ServiceDeed/GetByBlockNLot/" + blockNo + "/" + lotNo;
    // now you are passing values rather than undefined
    $("#display").html("");
    $("#msg").html("");
    $("#update").html("");
    $("#updateResult").html("");

    console.log("btnGetTaxByBL clicked");

Следующая проблема заключается в том, что в результате получается список (который, судя по всему, будет отправлен как массив) - но вы не используете ответ в виде массива

Изменяя

success: function (data) {
    var owner = data;
    $("#display").html( ... rest of your code

до

success: function (data) {
    var owner = data[0];
    $("#display").html( ... rest of your code

т.е. получить доступ к первому результату в полученном массиве, теперь вы будете отображать данные по мере необходимости

Если вы ожидаете массив, то есть более одной записи, то ваш код должен будет существенно измениться, потому что вам нужно будет перебирать данные и выводить несколько записей

возможно что-то вроде

success: function (data) {
    var owner = data;
    var html = data.map(function(owner) {
        return "<hr><p>".concat("HomeOwnerID: ", owner.HomeOwnerID,
        "<br>FirstName: ", owner.FirstName, "<br>LastName: ", owner.LastName,
        "<br>Address: ", owner.Address, "<br>City: ", owner.City,
        "<br>State: ", owner.State, "<br>ZipCode: ", owner.ZipCode,
        "<br>Telephone Number: ", owner.TelNo, "<br>Email: ", owner.Email,
        "<br>Block Number: ", owner.BlockNo, "<br>Lot Number: ", owner.LotNo,
        "<br>Date of Sale: ", owner.SaleDate, "<br>Sale Price: $", owner.SalePrice,
        "<br>Sold Status: ", owner.IsSold, "<br>Accessed Value: ", owner.AccessedVal,
        "<br>Land Value: ", owner.LandVal, "<br>Additional Value: ", owner.AdditionalVal,
        "<br>Tax Rate: ", owner.TaxRate, "<br>Tax Per Year: ", owner.TaxPerYear,
        "<br>Real Estate Tax: ", owner.RealEstateTax);
    }).join('');
    $("#display").html(html);
},

Answer 2

Ваш API возвращает список, поэтому вы должны добавить оператор «for» для отображения списка объектов, вы не можете использовать переменную «owner» в качестве объекта, потому что это массив объектов.