通过 post 将值传递给局部视图

Question

我想将一个长字符串从我的视图传递到部分视图，并在单击按钮时呈现部分视图。字符串太长，无法作为 url 的一部分传递，因此必须通过 post.

传递

单击按钮详细信息时，将调用一个 ajax 函数，该函数应将所需参数传递给局部视图并进行渲染。不幸的是，这不起作用，我的 ajax 声明中似乎有错误。当我单击“详细信息”按钮时，没有任何反应，调试器会跳过 ajax 声明。

这是我的部分观点：

<form class="form-inline" asp-controller="Order" asp-action="Details">
    
    <table class="ComplianceTable" id="ComplianceTable">
        <thead>
            <tr id='tableHeader'>
                <th>Res.</th>
                <th>Trend</th>
                <th>Portfolio</th>
                <th>Level</th>
                <th>Code</th>
                <th>Description</th>
                <th>Rule</th>
                <th>Test Type</th>
                <th>Limit</th>
                <th>Result</th>
                <th>(Previous)</th>
                <th>Severity</th>
                <th>Details</th>
            </tr>
        </thead>
        <tbody>

            @foreach (var info in Model.ViolationInfo)
            {
            <tr>
                <td>@info.RuleType</td>
                <td></td>
                <td>@Model.code</td>
                <td></td>
                <td></td>
                <td></td>
                <td>@info.RuleName</td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td>
                    <input type="hidden" id="value1" name="info.Diagnostic">
                    <button class="btn js-details" type="button" name="Details" data-id="@info.Diagnostic">
                            Details
                    </button>
                </td>
            </tr>
            <tr class="info"><td colspan="11">@info.Diagnostic</td></tr>
                    

                    }
            </tbody>
    </table>
    <div id="getComplianceDetails"></div>
</form>

这是我的局部视图：

@model string

<div id="getComplianceDetails">
   <p>Test</p>
   <p>
       @Model
   </p>
</div>

这是我的 javascript:

$(document).ready(function () {
$(document).on('click', '.js-details', function (event) {
    $("#ComplianceTable tr").removeClass("selected");
    $(this).closest('tr').addClass('selected');

    var $element = $(event.currentTarget);
    var id = $element.data('id');
    $.ajax({
        url: '@Url.Action("Details", "Order")',
        data: {info: id},
        type: "POST",
        success: function (data) {
            $('#getComplianceDetails').html(data);
        }
    });
});
});

这是我的 OrderController：

public ActionResult Details(string info)
    {
        return PartialView("~/Views/Shared/complianceDetails.cshtml", info);
    }

Answer 1

假设您的“信息”有价值，请尝试显式 url:

 url: '/Order/Details',

也许您需要将 [FromBody] 添加到您的操作中：

public ActionResult Details([FromBody] string info)
    {
        return PartialView("~/Views/Shared/complianceDetails.cshtml", info);
    }

通过 post 将值传递给局部视图

Passing value to partial view via post

c#

ajax

asp.net-mvc

model-view-controller

partial-views