asp.net 通过 AJAX 调用更改模型属性值

x759pob2 于 2023-08-08 发布在 .NET

关注(0)|答案(1)|浏览(108)

我有一个数据表，当单击被触发时，我想更改它，我的数据被 Package 在初始模型值（List）中。当我尝试调用它时，它会返回一个错误
POST https：//localhost：7230/controller/List 404

我的控制器

[HttpGet]
    public async Task<IActionResult> List()
    {
        //Call the repo to get data
        var blogPosts = await blogPostRepository.GetAllAsync();

        return View(blogPosts);
    }

    [HttpPost]
    public async Task<IActionResult> List(string sampType)
    {
        //Call the repo to get data
        var blogPosts = await blogPostRepository.GetAllAsync();

        if (sampType == "goku")
        {
            var gokuBlog = blogPosts.Where(x => x.Heading == "Goku");
            return View(gokuBlog);
        }

        return View(blogPosts);
    }

字符串

我的JavaScript

$("#updateBtn").click(function () {

$.post('/AdminBlog/List', { sampType: "goku" });
});

型

这里是我想更新的html表

@if(Model != null && Model.Any())
{
    <button id="updateBtn" class="btn btn-primary mb-2">Update</button>
        <table class="table">
            <thead>
                <tr>
                    <td>Id</td>
                    <td>Heading</td>
                    <td>Tags</td>
                    <td> </td>
                </tr>
            </thead>
            <tbody>
                @foreach (var blogPost in Model)
                {
                    <tr>
                        <td>@blogPost.Id</td>
                        <td>@blogPost.Heading</td>
                        <td>
                           <div class="d-flex">
                                @foreach (var tag in blogPost.Tags)
                                {
                                    <span class="badge bg-secondary me-2">@tag.Name</span>
                                }
                            </div>   
                        </td>
                        <td>
                            <a asp-area =""
                               asp-controller="AdminBlogPost" 
                               asp-action="Edit"
                               asp-route-id="@blogPost.Id">
                               Edit
                            </a>
                        </td>
                    </tr>
                }
            </tbody>
        </table>

型

asp.net

来源：https://stackoverflow.com/questions/76768412/change-model-property-value-through-ajax-call

1条答案

按热度按时间

qyuhtwio1#

您可以创建一个patialview来显示更改后的模型属性值，下面是一个工作演示，您可以参考一下：
1.创建_PatialList.cshtml：

<table id="p" class="table">
    <thead>
        <tr>
            <td>Id</td>
            <td>Heading</td>
            <td>Tags</td>
            <td> </td>
        </tr>
    </thead>
    <tbody>
        @foreach (var blogPost in Model)
        {
            <tr>
                <td>@blogPost.Id</td>
                <td>@blogPost.Heading</td>
                <td>
                    <div class="d-flex">
                        @foreach (var tag in blogPost.Tags)
                        {
                            <span class="badge bg-secondary me-2">@tag.Name</span>
                        }
                    </div>
                </td>
                <td>
                    <a asp-area=""
                       asp-controller="AdminBlogPost"
                       asp-action="Edit"
                       asp-route-id="@blogPost.Id">
                        Edit
                    </a>
                </td>
            </tr>
        }
    </tbody>
</table>

字符串
2.在帖子列表中，操作更改如下：

[HttpPost]
    public async Task<IActionResult> List(string sampType)
    {
        //Call the repo to get data
        var blogPosts = await blogPostRepository.GetAllAsync();

        if (sampType == "goku")
        {
            var gokuBlog = blogPosts.Where(x => x.Heading == "Goku");
            //return View(gokuBlog);
            return PartialView("_PatialList", gokuBlog);
        }

        return View(blogPosts);
    }

型
1.将id添加到html表中，如下所示：第一个月
4.然后在 AJAX 中添加一个函数来显示数据：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>

$("#updateBtn").click(function () {

$.post('/AdminBlog/List', { sampType: "goku" }, function (data) {
            $('#p').html(data);
        });
});

型
结果：

的数据

赞(0）回复(0）举报 2023-08-08

我来回答

asp.net 通过 AJAX 调用更改模型属性值

1条答案

相关问题

热门标签

最新问答