Загрузка частичного представления в mvc с использованием JQuery

Question

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

У меня есть следующий соответствующий код:

ShowStatistics.cshtml

 <script src="/scripts/jquery-3.3.1.js" type="text/javascript"></script>
    <script>


$(document).ready(function () {
        $('.jsload').on('click', function (evt) {
                evt.preventDefault();
                evt.stopPropagation();

            var $detailDiv = $('#detailsDiv'),
                url = $(this).data('url');

            $.get(url, function (data) {
                $detailDiv.replaceWith(data);
            });
        });
})
</script>

<div id="detailsDiv">
            <!--Content gets loaded by JQuery-->
</div>
        <button data-url='@Url.Action("Details","Statistics", new { id = Model.Id } )' class="jsload">
            Show Skills
        </button>

PlayerSkills.cshtml

@model MVC.Models.ViewPlayerSkills
@{
    Layout = null;
}
<p>HAHAHAHAHAHAHHAHAHAHHAHAHAHAHHAH</p>
@foreach (var property in ViewData.ModelMetadata.Properties)
{
    <div class="editor">
        <label>@(property.DisplayName ?? property.PropertyName):</label>
        @Html.Display(property.PropertyName)
    </div>
}

StatisticsController.cs

        public ActionResult Details(int id)
    {
        List<Player> allPlayers = GetPlayers();
        Player pl = allPlayers.Where(x => x.Id == id).FirstOrDefault();
        ViewPlayerSkills player = new ViewPlayerSkills(pl);
        return PartialView("PlayerSkills", player);

    }

I 'получаю следующее сообщение об ошибке:

Uncaught ReferenceError: данные не определены в Object.success (3:21) при пожаре (jquery-3.3.1.js: 3268) в Object.fireWith [as resolWith] (jquery-3.3.1.js: 3398) в готовом (jquery-3.3.1.js: 9305) в XMLHttpRequest.(jquery-3.3.1.js: 9548) (анонимно) @ 3:21 fire @ jquery-3.3.1.js: 3268 fireWith @ jquery-3.3.1.js: 3398 done @ jquery-3.3.1.js:9305 (анонимный) @ jquery-3.3.1.js: 9548 загрузка (асинхронная) send @ jquery-3.3.1.js: 9567 ajax @ jquery-3.3.1.js: 9206 jQuery. (Анонимная функция) @ jquery-3.3.1.js: 9355 (анонимно) @ 3:20 рассылка @ jquery-3.3.1.js: 5183 elemData.handle @ jquery-3.3.1.js: 4991

Когда я иду вURL http://localhost:{port}/Statistics/Details/5

Я получаю желаемый результат:

Answer 1

<script src="/scripts/jquery-3.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('.jsload').on('click', function (evt) {
            evt.preventDefault();
            evt.stopPropagation();;
            $('#detailsDiv').load($(this).data('url'));
        });
    })
</script>
<div id="detailsDiv">
    <!--Content gets loaded by JQuery-->
</div>
<button data-url='@Url.Action("Details","Statistics", new { id = Model.Id } 
)' class="jsload">
  Show Skills
</button>