无法使用 JQuery Ajax Post 调用显示项目列表

Question

我的 ItemsController 中有以下代码：

public PartialViewResult GetAllItems()
        {
            IEnumerable<ItemDetailsViewModel> listOfItemDetailsViewModels =
                    (from objItem in objVPPhamEntities.Items
                     select new ItemDetailsViewModel()
                     {
                         ImagePath=objItem.ImagePath,
                         CategoryId = objItem.CategoryId,
                         ItemId = objItem.ItemId,
                         ItemName = objItem.ItemName,
                         ItemPrice=objItem.ItemPrice,
                         Description=objItem.Description
                     }).ToList();
            return PartialView("_ItemDetailsPartial.cshtml", listOfItemDetailsViewModels);
        }

然后在我的 javascript in index 中：

$(document).ready(function () {
        LoadItemDetails();
});
function LoadItemDetails() {
            $.ajax({
                async: true,
                data: 'GET',
                dataType: 'html',
                contentType: false,
                processData: false,
                url: '@Url.Action("GetAllItems","Items")',
                success: function (data) {
                    $("#divLoadItemDetails").html(data);
                },
                error: function () {
                    alert('Error.');
                }
            });
        }

这是我的 _ItemDetailsPartial

   @model IEnumerable<WebApplication3.ViewModel.ItemDetailsViewModel>

<table style="width:100%">
    <thead>
        <tr>
            <th>

            </th>
            <th>
                Ảnh
            </th>
            <th>
                Mã hàng
            </th>
            <th>
                Mã sản phẩm
            </th>
            <th>
                Tên sản phẩm
            </th>
            <th>
                Giá
            </th>
            <th>
                Chi tiết
            </th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    <span id="btnDelete" class="glyphicon glyphicon-trash" onclick="DeleteItem(@item.ItemId)"></span> &nbsp;&nbsp;
                    <span id="btnEdit" class="glyphicon glyphicon-pencil" onclick="EditItem(@item.ItemId)"></span>
                </td>
                <td>
                    <img src="@Url.Content("~/ItemImage/"+ item.ImagePath)" width="30" height="30" class="img-responsive"/>
                </td>
                <td>
                    @item.CategoryId
                </td>
                <td>
                    @item.ItemId
                </td>
                <td>
                    @item.ItemName
                </td>
                <td>
                    @item.ItemPrice
                </td>
                <td>
                    @item.Description
                </td>
            </tr>
        }
    </tbody>
</table>

最后是我的 html in index:

 <div id="divLoadItemDetails"></div>

我想显示来自 sql server 的项目列表 添加项目功能运行良好，但我无法显示项目列表。当我运行它而不是显示项目列表时，它总是说错误。谁能帮帮我？？？

Answer 1

你必须修复 ajax。试试这个

function LoadItemDetails() {
            $.ajax({
                type: 'GET',
                url: '/items/GetAllItems',
                success: function (data) {
                    $("#divLoadItemDetails").html(data);
                },
                error: function (xhr) {
                    alert(xhr.responseText);
                }
            });
        }

顺便说一下，您使用的是 Get 调用，而不是 POST，因为它写在您的问题标题中。试试这个动作标题

[Route("~/Items/GetAllItems")]
public IActionResult GetAllItems()
{
.....your code here
}